* { box-sizing: border-box; }
html { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -0.025em; }
small { color: var(--muted); }
[hidden] { display: none !important; }

.eyebrow { margin: 0 0 6px; color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .105em; text-transform: uppercase; }
.muted { color: var(--muted); }
.text-danger { color: var(--danger); }
.text-success { color: var(--success); }

.brand-mark {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  background: #050a11;
  box-shadow: 0 14px 32px rgba(20,100,244,.22);
}
.brand-mark::after { content: ""; position: absolute; inset: 1px; border-radius: 14px; border: 1px solid rgba(255,255,255,.10); pointer-events: none; }
.brand-mark.brand-logo { padding: 4px; }
.brand-mark.brand-logo img { width: 100%; height: 100%; display: block; object-fit: contain; border-radius: 11px; }
.brand-mark.small { width: 44px; height: 44px; border-radius: 12px; box-shadow: 0 9px 22px rgba(20,100,244,.18); }
.brand-mark.small::after { border-radius: 10px; }
.brand-mark.small.brand-logo { padding: 3px; }


label { display: grid; gap: 7px; color: #344054; font-size: 13px; font-weight: 750; }
input, select, textarea {
  width: 100%;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: #fff;
  padding: 11px 12px;
  color: var(--text);
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}
input:hover, select:hover, textarea:hover { border-color: #aebac8; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(20,100,244,.11); }
textarea { min-height: 96px; resize: vertical; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 9px 14px;
  font-weight: 800;
  line-height: 1;
  transition: transform var(--transition), background var(--transition), border-color var(--transition), box-shadow var(--transition), color var(--transition);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.btn-primary { background: var(--primary); color: #fff; box-shadow: 0 8px 18px rgba(20,100,244,.20); }
.btn-primary:hover { background: var(--primary-hover); box-shadow: 0 10px 22px rgba(20,100,244,.27); }
.btn-secondary { background: #fff; color: #27364a; border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.btn-secondary:hover { border-color: #aab7c6; background: #f8fafc; }
.btn-ghost { background: transparent; color: var(--muted); border-color: transparent; }
.btn-ghost:hover { background: rgba(20,100,244,.08); color: var(--primary); }
.btn-danger { background: var(--danger-soft); border-color: #ffd3cf; color: var(--danger); }
.btn-sm { min-height: 34px; padding: 7px 10px; font-size: 12px; }
.btn-icon { width: 38px; padding: 0; }
.full { width: 100%; }

.icon { width: 18px; height: 18px; display: inline-block; flex: 0 0 auto; }
.icon-sm { width: 15px; height: 15px; }
.form-error { margin: 0; padding: 10px 12px; border-radius: 9px; background: var(--danger-soft); color: var(--danger); font-size: 13px; font-weight: 650; }