:root {
  --wj-font-family: 'Cabin', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --wj-font-display: 'Readex Pro', 'Cabin', system-ui, sans-serif;
  --wj-text-1: #10182d;
  --wj-text-2: #52617a;
  --wj-text-3: #7f8ba1;
  --wj-surface-0: #f3f6fb;
  --wj-surface-1: #ffffff;
  --wj-surface-2: #f7f9fc;
  --wj-border: #dbe3ef;
  --wj-primary: #5e43f5;
  --wj-primary-strong: #4629dc;
  --wj-success: #16a873;
  --wj-warning: #e99a13;
  --wj-danger: #dc4b5d;
  --wj-info: #2d70e8;
  --wj-purple: #7a45e7;
  --wj-radius-sm: 10px;
  --wj-radius-md: 16px;
  --wj-radius-lg: 24px;
  --wj-radius-xl: 32px;
  --wj-shadow-sm: 0 6px 20px rgba(21,31,54,.07);
  --wj-shadow-md: 0 18px 50px rgba(21,31,54,.12);
  --wj-motion-fast: 160ms;
  --wj-motion: 240ms;
  --wj-ease: cubic-bezier(.2,.8,.2,1);
  --wj-fs-caption: clamp(.82rem,.79rem + .15vw,.9rem);
  --wj-fs-small: clamp(.92rem,.89rem + .18vw,1rem);
  --wj-fs-body: clamp(1rem,.96rem + .22vw,1.08rem);
  --wj-fs-title: clamp(1.25rem,1.14rem + .45vw,1.55rem);
  --wj-fs-h3: clamp(1.5rem,1.34rem + .65vw,1.95rem);
  --wj-fs-h2: clamp(1.9rem,1.65rem + 1vw,2.65rem);
  --wj-fs-h1: clamp(2.35rem,1.95rem + 1.65vw,3.75rem);
}

.wjc-design-system,
.wjc-design-system button,
.wjc-design-system input,
.wjc-design-system select,
.wjc-design-system textarea { font-family: var(--wj-font-family); }

.wjc-title-1,.wjc-title-2,.wjc-title-3,.wjc-title { font-family:var(--wj-font-display); }

.wjc-title-1 { font-size: var(--wj-fs-h1); line-height: 1.03; letter-spacing: -.045em; font-weight: 760; }
.wjc-title-2 { font-size: var(--wj-fs-h2); line-height: 1.08; letter-spacing: -.035em; font-weight: 740; }
.wjc-title-3 { font-size: var(--wj-fs-h3); line-height: 1.14; letter-spacing: -.025em; font-weight: 720; }
.wjc-title { font-size: var(--wj-fs-title); line-height: 1.25; font-weight: 700; }
.wjc-body { font-size: var(--wj-fs-body); line-height: 1.62; }
.wjc-small { font-size: var(--wj-fs-small); line-height: 1.5; }
.wjc-caption { font-size: var(--wj-fs-caption); line-height: 1.4; color: var(--wj-text-3); }

.wjc-card { background: var(--wj-surface-1); border: 1px solid var(--wj-border); border-radius: var(--wj-radius-lg); box-shadow: var(--wj-shadow-sm); padding: clamp(18px,2.4vw,30px); color: var(--wj-text-1); }
.wjc-card--interactive { transition: transform var(--wj-motion) var(--wj-ease), box-shadow var(--wj-motion) var(--wj-ease), border-color var(--wj-motion) var(--wj-ease); }
.wjc-card--interactive:hover { transform: translateY(-2px); box-shadow: var(--wj-shadow-md); border-color: rgba(94,67,245,.25); }

.wjc-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 20px; border-radius: 14px; border: 1px solid transparent; font-size: var(--wj-fs-small); line-height: 1; font-weight: 700; text-decoration: none; cursor: pointer; transition: transform var(--wj-motion-fast) var(--wj-ease), box-shadow var(--wj-motion-fast) var(--wj-ease), background var(--wj-motion-fast) ease; }
.wjc-button:active { transform: scale(.975); }
.wjc-button--primary { color:#fff; background:linear-gradient(135deg,var(--wj-primary),#7737ef); box-shadow:0 12px 26px rgba(94,67,245,.24); }
.wjc-button--secondary { color:var(--wj-text-1); background:var(--wj-surface-1); border-color:var(--wj-border); }
.wjc-button--ghost { color:var(--wj-text-2); background:transparent; }
.wjc-button--danger { color:#fff; background:var(--wj-danger); }
.wjc-button--success { color:#fff; background:var(--wj-success); }
.wjc-button--icon { width:48px; padding:0; color:var(--wj-primary); background:var(--wj-surface-1); border-color:var(--wj-border); }

.wjc-badge { display:inline-flex; align-items:center; gap:8px; min-height:32px; padding:5px 11px; border:1px solid transparent; border-radius:999px; font-size:var(--wj-fs-caption); line-height:1; font-weight:700; white-space:nowrap; }
.wjc-badge__dot { width:8px; height:8px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.wjc-badge--neutral { color:#59667a; background:#f2f5f9; border-color:#e3e8ef; }
.wjc-badge--info { color:#2868cc; background:#edf4ff; border-color:#d8e8ff; }
.wjc-badge--warning { color:#a66a00; background:#fff7e8; border-color:#f7dfb0; }
.wjc-badge--success { color:#117c58; background:#ebfaf4; border-color:#ccefe1; }
.wjc-badge--danger { color:#b43e4e; background:#fff0f2; border-color:#f6d6dc; }
.wjc-badge--purple { color:#6840c7; background:#f4efff; border-color:#e3d8ff; }

.wjc-field { display:grid; gap:8px; }
.wjc-label { color:var(--wj-text-1); font-size:var(--wj-fs-small); line-height:1.3; font-weight:700; }
.wjc-input,.wjc-select,.wjc-textarea { width:100%; min-height:52px; color:var(--wj-text-1); background:var(--wj-surface-2); border:1px solid var(--wj-border); border-radius:14px; padding:0 16px; font-size:var(--wj-fs-body); outline:none; transition:border-color var(--wj-motion-fast),box-shadow var(--wj-motion-fast),background var(--wj-motion-fast); box-sizing:border-box; }
.wjc-textarea { min-height:140px; padding-top:14px; resize:vertical; }
.wjc-input:focus,.wjc-select:focus,.wjc-textarea:focus { background:#fff; border-color:rgba(94,67,245,.65); box-shadow:0 0 0 4px rgba(94,67,245,.11); }

.wjc-brand-logo { display:block; object-fit:contain; filter:drop-shadow(0 10px 20px rgba(58,52,174,.2)); animation:wjc-logo-breathe 4.8s ease-in-out infinite; }
@keyframes wjc-logo-breathe { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-2px) scale(1.025)} }

.wjc-toast-stack { position:fixed; top:20px; right:20px; z-index:100000; display:grid; gap:10px; width:min(390px,calc(100vw - 32px)); }
.wjc-toast { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; background:rgba(18,24,44,.96); color:#fff; border:1px solid rgba(255,255,255,.12); border-radius:16px; box-shadow:0 20px 48px rgba(6,11,25,.28); backdrop-filter:blur(18px); animation:wjc-toast-in .24s var(--wj-ease); }
.wjc-toast__logo { width:28px; height:28px; object-fit:contain; }
.wjc-toast__text { font-size:var(--wj-fs-small); line-height:1.45; }
@keyframes wjc-toast-in { from{opacity:0;transform:translateY(-8px) scale(.98)} to{opacity:1;transform:none} }

@media (prefers-color-scheme:dark) {
  .wjc-design-system {
    --wj-text-1:#f7f8fc; --wj-text-2:#c8cfdd; --wj-text-3:#949fb3;
    --wj-surface-0:#0e1220; --wj-surface-1:#151a2b; --wj-surface-2:#1b2134; --wj-border:#2b344c;
  }
  .wjc-input:focus,.wjc-select:focus,.wjc-textarea:focus { background:#171d30; }
  .wjc-badge--neutral { color:#c9d0dc; background:#222a3e; border-color:#313b54; }
}

@media (max-width:767px) {
  :root { --wj-fs-body:1.05rem; --wj-fs-small:.98rem; --wj-fs-caption:.9rem; }
  .wjc-card { border-radius:20px; padding:18px; }
  .wjc-button { min-height:50px; }
  .wjc-toast-stack { top:14px; right:16px; }
}

/* Core 4.2.4 — typography compatibility with Woodmart */
.wjc-design-system h1,.wjc-design-system h2,.wjc-design-system h3,.wjc-design-system h4,.wjc-design-system h5,.wjc-design-system h6{font-family:var(--wj-font-display)!important;font-weight:500}
