/* wdlobin.com shared design system: global tokens, typography and site chrome. */
:root {
  --site-bg:#f7f8fa; --site-surface:#fff; --site-text:#191b20;
  --site-text-secondary:#575c66; --site-text-muted:#747983;
  --site-line:#e1e4e9; --site-line-soft:#eceef2;
  --site-accent:#3659d6; --site-accent-soft:#edf1ff; --site-mark:#db6042;
  --site-radius:12px; --site-header-height:64px; --site-content:1240px;
  --site-reading:720px; --site-gutter:24px;
  --site-font-sans:Inter,"Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --site-font-code:"Fira Code",ui-monospace,SFMono-Regular,Consolas,monospace;
  --site-ease:cubic-bezier(.2,.8,.2,1);
  /* Transitional aliases for existing page components. */
  --bg:var(--site-bg); --surface:var(--site-surface); --text:var(--site-text);
  --text-primary:var(--site-text); --text-secondary:var(--site-text-secondary);
  --text-tertiary:var(--site-text-muted); --secondary:var(--site-text-secondary);
  --muted:var(--site-text-muted); --border:var(--site-line); --line:var(--site-line);
  --light:var(--site-line-soft); --border-light:var(--site-line-soft);
  --accent:var(--site-accent); --accent-soft:var(--site-accent-soft); --radius:var(--site-radius);
}
*,*::before,*::after{box-sizing:border-box}
html{min-width:320px;max-width:100%;overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{min-height:100vh;margin:0;overflow-x:clip;color:var(--site-text);background-color:var(--site-bg);background-image:radial-gradient(circle at 14% -5%,rgba(54,89,214,.055),transparent 30rem),linear-gradient(180deg,#fafbfc 0,var(--site-bg) 22rem);font-family:var(--site-font-sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}img,svg,video{max-width:100%}::selection{color:var(--site-text);background:#cfd8ff}
.site-header,body>header,.wdl-site-header{position:sticky;top:0;z-index:100;min-height:var(--site-header-height);border-bottom:1px solid color-mix(in srgb,var(--site-line) 82%,transparent);background:color-mix(in srgb,var(--site-surface) 88%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.nav-container,.site-nav-inner,.wdl-header-inner{width:min(100%,calc(var(--site-content) + 2 * var(--site-gutter)));max-width:none!important;height:var(--site-header-height)!important;min-height:var(--site-header-height)!important;margin-inline:auto!important;padding-inline:var(--site-gutter)!important;display:flex;align-items:center;justify-content:space-between}
.hero,.section,.page-hero,.page-layout,main:not([class]),.footer-inner,.site-footer-inner{width:min(100%,calc(var(--site-content) + 2 * var(--site-gutter)));max-width:none!important;margin-inline:auto}
.logo,.site-brand,.wdl-brand{display:inline-flex;align-items:center;gap:10px;color:var(--site-text)!important;font-family:var(--site-font-sans)!important;font-size:1.15rem!important;font-weight:700!important;line-height:1.2!important;letter-spacing:-.02em!important;text-decoration:none!important;white-space:nowrap}
.logo-avatar,.site-brand-mark,.wdl-brand-mark{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;border-radius:8px;background:var(--site-text)!important;color:#fff!important;font-size:14px!important;font-weight:600!important;line-height:1!important}
.logo>:last-child::after,.site-brand>:last-child::after,.wdl-brand>:last-child::after{content:"_";margin-left:.08em;color:var(--site-mark)}
.desktop-nav,.site-nav,.wdl-nav{display:flex;align-items:center;gap:32px;margin:0;font-family:var(--site-font-sans)!important}
.desktop-nav a,.site-nav a,.wdl-nav a{position:relative;padding:4px 0;color:var(--site-text-secondary)!important;font-family:inherit!important;font-size:.9rem!important;font-weight:500!important;line-height:1.7!important;text-decoration:none!important}
.desktop-nav a::after,.site-nav a::after,.wdl-nav a::after{content:"";position:absolute;right:100%;bottom:0;left:0;height:2px;border-radius:2px;background:var(--site-text);transition:right .22s var(--site-ease)}
.desktop-nav a:hover,.desktop-nav a[aria-current=page],.site-nav a:hover,.site-nav a[aria-current=page],.wdl-nav a:hover,.wdl-nav a[aria-current=page]{color:var(--site-text)!important}
.desktop-nav a:hover::after,.desktop-nav a[aria-current=page]::after,.site-nav a:hover::after,.site-nav a[aria-current=page]::after,.wdl-nav a:hover::after,.wdl-nav a[aria-current=page]::after{right:0}
.mobile-menu-btn,.wdl-menu-toggle,.mobile-nav,.wdl-mobile-nav{display:none}
.site-footer,body>footer,.wdl-site-footer{width:100%;max-width:none!important;margin-top:auto;color:var(--site-text-muted);border-top:1px solid var(--site-line-soft);background:transparent;font-family:var(--site-font-sans)}
.footer-inner,.site-footer-inner,.wdl-site-footer>.wp-block-group{width:min(100%,calc(var(--site-content) + 2 * var(--site-gutter)));max-width:none!important;min-height:88px;margin-inline:auto!important;padding:28px var(--site-gutter)!important;display:flex;align-items:center;justify-content:space-between;gap:20px;border:0!important;font-family:var(--site-font-sans)!important;font-size:.82rem!important;font-weight:400!important;line-height:1.7!important}
.footer-inner>*,.site-footer-inner>*,.wdl-site-footer>.wp-block-group>*{margin-block:0!important;font:inherit!important}
.footer-links{display:flex;flex-wrap:wrap;gap:20px}.footer-links a,.site-footer a,.wdl-site-footer a{color:inherit;text-decoration:none}.footer-links a:hover,.site-footer a:hover,.wdl-site-footer a:hover{color:var(--site-text)}
.category-nav{gap:2px;padding:14px 10px;border:1px solid var(--site-line);border-radius:var(--site-radius);background:rgba(255,255,255,.82);box-shadow:0 6px 22px rgba(24,31,48,.035)}
.category-nav span{padding:0 10px 7px;font-size:.76rem}.category-nav a{padding:8px 10px;font-size:.95rem;font-weight:500;line-height:1.45}
@media(min-width:1600px){
  :root{--site-content:1440px}body{font-size:17px}
  .page-layout{grid-template-columns:136px minmax(0,1fr) 320px;gap:24px}
  .page-hero h1{font-size:2.6rem}.page-hero>p:not(.eyebrow){font-size:1.06rem}
  .resource-card strong{font-size:1.02rem}.resource-card span{font-size:.88rem}
  .category-nav a{font-size:1rem}.tool-grid button{font-size:.9rem}
}
@media(max-width:700px){
  :root{--site-gutter:16px}.nav-container,.site-nav-inner,.wdl-header-inner{width:100%}
  .site-header,body>header,.wdl-site-header{transition:transform .2s var(--site-ease)}
  .site-header.is-scroll-hidden,body>header.is-scroll-hidden,.wdl-site-header.is-scroll-hidden{transform:translateY(calc(-100% - 1px))}
  .desktop-nav,.site-nav,.wdl-nav{display:none!important}
  .mobile-menu-btn,.wdl-menu-toggle{width:42px;height:42px;padding:9px;display:grid!important;place-content:center;gap:5px;border:0;border-radius:8px;background:transparent;color:var(--site-text);cursor:pointer}
  .mobile-menu-btn span,.wdl-menu-toggle span{width:23px;height:2px;display:block;margin:0!important;border-radius:2px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
  .mobile-menu-btn[aria-expanded=true] span:nth-child(1),.wdl-menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)!important}
  .mobile-menu-btn[aria-expanded=true] span:nth-child(2),.wdl-menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0!important}
  .mobile-menu-btn[aria-expanded=true] span:nth-child(3),.wdl-menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)!important}
  .mobile-nav.open,.wdl-mobile-nav.is-open{position:absolute!important;top:100%!important;right:0;left:0;z-index:101;margin:0!important;padding:8px 20px 14px!important;display:flex!important;flex-direction:column;align-items:stretch!important;gap:0!important;border-bottom:1px solid var(--site-line)!important;background:color-mix(in srgb,#fff 96%,transparent)!important;box-shadow:0 14px 30px rgba(24,31,48,.06);text-align:left!important}
  .mobile-nav a,.wdl-mobile-nav a{padding:12px 0!important;color:var(--site-text-secondary)!important;border-bottom:1px solid var(--site-line)!important;font-family:var(--site-font-sans)!important;font-size:.9rem!important;text-decoration:none!important}
  .mobile-nav a:last-child,.wdl-mobile-nav a:last-child{border-bottom:0!important}
  .category-nav{padding:0 0 4px;border:0;border-radius:0;background:transparent;box-shadow:none}
  .footer-inner,.site-footer-inner,.wdl-site-footer>.wp-block-group{min-height:0;padding:24px var(--site-gutter) 28px!important;align-items:flex-start;flex-direction:column;gap:8px}
  .footer-left,.wdl-footer-note{max-width:100%;font-size:.8rem;line-height:1.55}
  .footer-right,.footer-links{width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:0 20px}
  .footer-right a,.footer-links a{padding:3px 0;font-size:.82rem;line-height:1.7}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.site-header,body>header,.wdl-site-header{transform:none!important}}