/* ============================================================
   GOOD PEOPLE v7 — Elite Final Design System
   Private. Cinematic. World-class. Investor-ready.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

:root {
  /* ── Deep Black System ── */
  --bg:        #050507;
  --bg-2:      #0D0D12;
  --bg-3:      #141420;
  --bg-4:      #1A1A28;
  --bg-5:      #202030;

  /* ── Purple System ── */
  --purple:      #7A5CFF;
  --purple-2:    #9B82FF;
  --purple-3:    #C4B4FF;
  --purple-glow: rgba(122,92,255,0.15);
  --purple-pale: rgba(122,92,255,0.09);
  --purple-border: rgba(122,92,255,0.28);
  --purple-deep:   rgba(122,92,255,0.06);

  /* ── Text ── */
  --t1: #F0F0F8;
  --t2: #B8B8C5;
  --t3: #6A6A80;
  --t4: #363650;

  /* ── Borders ── */
  --border:   rgba(255,255,255,0.05);
  --border-2: rgba(255,255,255,0.09);
  --border-3: rgba(255,255,255,0.14);

  /* ── Semantic ── */
  --success: #4CAF84;
  --error:   #E05555;
  --sage:    #5A9A7A;

  /* ── Shadows ── */
  --shadow-sm: 0 2px 16px rgba(0,0,0,0.5);
  --shadow:    0 6px 32px rgba(0,0,0,0.6);
  --shadow-lg: 0 16px 64px rgba(0,0,0,0.7);
  --shadow-purple: 0 4px 28px rgba(122,92,255,0.28);
  --glow-card: 0 0 0 1px rgba(255,255,255,0.05), 0 8px 32px rgba(0,0,0,0.5);

  /* ── Radius ── */
  --r-sm: 10px; --r: 16px; --r-lg: 22px; --r-xl: 28px; --r-full: 999px;

  /* ── Type ── */
  --serif: 'Playfair Display', Georgia, serif;
  --sans:  'Inter', -apple-system, sans-serif;

  /* ── Motion ── */
  --ease:     cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --t: 0.2s; --t-slow: 0.38s;
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;-webkit-text-size-adjust:100%;}
body{font-family:var(--sans);background:var(--bg);color:var(--t1);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
button{font-family:var(--sans);cursor:pointer;border:none;background:none;}
input,textarea,select{font-family:var(--sans);}
input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px var(--bg-3) inset!important;-webkit-text-fill-color:var(--t1)!important;}

/* ── TYPOGRAPHY ── */
.serif{font-family:var(--serif);}
.t-display{font-family:var(--serif);font-size:clamp(44px,7vw,88px);font-weight:400;line-height:1.0;letter-spacing:-0.03em;}
.t-h1{font-family:var(--serif);font-size:clamp(28px,4vw,40px);font-weight:400;line-height:1.15;letter-spacing:-0.02em;}
.t-h2{font-family:var(--serif);font-size:clamp(22px,3vw,30px);font-weight:400;line-height:1.2;}
.t-label{font-size:10px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--t3);}
.t-purple{color:var(--purple-3);}
.t-muted{color:var(--t3);}
.t-body{font-size:14px;line-height:1.75;color:var(--t2);font-weight:300;}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;border-radius:var(--r-full);font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:0.02em;cursor:pointer;border:none;transition:all var(--t) var(--ease);white-space:nowrap;position:relative;}
.btn:active{transform:scale(0.97)!important;}
.btn-sm{padding:9px 18px;font-size:12px;letter-spacing:0.03em;}
.btn-lg{padding:16px 32px;font-size:15px;}
.btn-full{width:100%;}
.btn-primary{background:linear-gradient(135deg,var(--purple),#5A40D4);color:white;box-shadow:var(--shadow-purple);}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 36px rgba(122,92,255,0.38);filter:brightness(1.07);}
.btn-surface{background:var(--bg-3);color:var(--t1);border:1px solid var(--border-2);}
.btn-surface:hover{background:var(--bg-4);border-color:var(--border-3);}
.btn-outline{background:transparent;color:var(--purple-3);border:1px solid var(--purple-border);}
.btn-outline:hover{background:var(--purple-pale);}
.btn-ghost{background:var(--bg-3);color:var(--t2);border:1px solid var(--border);}
.btn-ghost:hover{background:var(--bg-4);color:var(--t1);}
.btn:disabled{opacity:0.35;cursor:not-allowed;transform:none!important;}

/* ── FORMS ── */
.form-group{display:flex;flex-direction:column;gap:7px;}
.form-label{font-size:10px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--t3);}
.form-input{width:100%;padding:14px 16px;background:var(--bg-3);border:1px solid var(--border);border-radius:var(--r-sm);font-size:14px;color:var(--t1);outline:none;transition:all var(--t);line-height:1.5;}
.form-input:focus{border-color:var(--purple-border);background:var(--bg-4);box-shadow:0 0 0 3px var(--purple-glow);}
.form-input::placeholder{color:var(--t4);}
textarea.form-input{resize:vertical;min-height:100px;line-height:1.65;}

/* ── CHIPS ── */
.chip{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:var(--r-full);font-size:12px;font-weight:500;letter-spacing:0.02em;background:var(--bg-3);color:var(--t2);border:1px solid var(--border);cursor:pointer;transition:all var(--t);user-select:none;}
.chip:hover:not(.selected){border-color:var(--purple-border);color:var(--t1);}
.chip.selected{background:var(--purple-pale);color:var(--purple-3);border-color:var(--purple-border);}
.chip-sm{padding:5px 11px;font-size:11px;}
.chip-xs{padding:3px 9px;font-size:10px;}

/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 11px;border-radius:var(--r-full);font-size:11px;font-weight:600;letter-spacing:0.04em;}
.badge-purple{background:var(--purple-pale);color:var(--purple-3);border:1px solid var(--purple-border);}
.badge-dark{background:rgba(5,5,7,0.85);backdrop-filter:blur(8px);color:var(--t1);border:1px solid var(--border-2);}
.badge-success{background:rgba(76,175,132,0.12);color:#6AC8A0;}

/* ── AVATAR ── */
.avatar{border-radius:50%;object-fit:cover;display:flex;align-items:center;justify-content:center;background:var(--bg-4);flex-shrink:0;overflow:hidden;}
.avatar-xs{width:28px;height:28px;font-size:13px;}
.avatar-sm{width:36px;height:36px;font-size:17px;}
.avatar-md{width:50px;height:50px;font-size:22px;}
.avatar-lg{width:80px;height:80px;font-size:34px;}
.avatar-xl{width:108px;height:108px;font-size:48px;}

/* ── SPINNER ── */
.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,0.1);border-top-color:rgba(255,255,255,0.7);border-radius:50%;animation:spin 0.65s linear infinite;flex-shrink:0;}
.spinner-purple{border-color:var(--purple-pale);border-top-color:var(--purple-2);}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── TOAST ── */
.toast{position:fixed;bottom:28px;left:50%;z-index:9999;transform:translateX(-50%) translateY(16px);background:var(--bg-4);color:var(--t1);padding:12px 22px;border-radius:var(--r-full);font-size:13px;font-weight:400;letter-spacing:0.02em;opacity:0;pointer-events:none;transition:all 0.28s var(--ease-out);white-space:nowrap;box-shadow:var(--shadow-lg);border:1px solid var(--border-2);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.success{background:rgba(76,175,132,0.9);border-color:transparent;}
.toast.error{background:rgba(224,85,85,0.9);border-color:transparent;}

/* ── TRANSITIONS ── */
.screen{display:none;animation:fadeUp 0.28s var(--ease-out);}
.screen.active{display:block;}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
@keyframes overlayIn{from{opacity:0;transform:translateY(48px);}to{opacity:1;transform:translateY(0);}}

/* ── DIVIDER ── */
.divider{height:1px;background:var(--border);}
.section-divider{height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:0 24px;}

/* ── EMPTY STATES ── */
.empty-state{padding:52px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;}
.empty-icon{width:56px;height:56px;border-radius:50%;background:var(--bg-3);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:6px;}
.empty-state h3{font-family:var(--serif);font-size:19px;font-weight:400;color:var(--t1);}
.empty-state p{font-size:13px;color:var(--t3);line-height:1.75;max-width:260px;font-weight:300;}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:3px;}::-webkit-scrollbar-track{background:transparent;}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:2px;}

/* ── UTILS ── */
.flex{display:flex;}.flex-center{display:flex;align-items:center;justify-content:center;}.flex-between{display:flex;align-items:center;justify-content:space-between;}
.w-full{width:100%;}.hidden{display:none!important;}.text-center{text-align:center;}