/* Modernized Design tokens and global styles for GratisEvo UI */
:root{
  /* Color tokens */
  --bg: #f7faf6;
  --surface: #ffffff;
  --muted: #4f6050;
  --text: #1d2f22;
  --primary: #5E8458;
  --primary-600: #4d714a;
  --primary-soft: rgba(94, 132, 88, 0.08);
  --primary-soft-strong: rgba(94, 132, 88, 0.12);
  --success: #2d7d4c;
  --warning: #b97a1c;
  --danger: #d95b5b;
  --glass: rgba(29,47,34,0.04);

  /* Spacing / sizes */
  --radius: 10px;
  --card-padding: 1.25rem;
  --gap-sm: 0.5rem;
  --gap-md: 1rem;
  --gap-lg: 1.5rem;

  /* Typography */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --h1: 2rem;
  --h2: 1.5rem;
  --h3: 1.125rem;
  --lead: 1.05rem;
}

/* Base */
html,body{height:100%;}
body{
  font-family: var(--font-sans);
  color:var(--text);
  background:
    radial-gradient(circle at top, rgba(94,132,88,0.05), transparent 30%),
    var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  margin:0;
}

main.container{
  padding-top: 1.5rem;
  padding-bottom: 2.5rem;
}

/* Layout helpers */
/* Clean link styling to keep the page visually calm */
a, a:visited{color:var(--primary);text-decoration:none;transition:color .12s ease, opacity .12s ease}
a:hover{text-decoration:none;color:var(--primary-600)}
a:focus{outline:3px solid rgba(94,132,88,0.12);outline-offset:2px}

.favorite-box{padding:.8rem;border:1px solid #edf2ea;border-radius:12px;background:linear-gradient(180deg, rgba(94,132,88,0.03), rgba(94,132,88,0.01));}
.favorite-box .btn{font-weight:600}
.favorite-box .small{line-height:1.5}

.faq-list{display:flex;flex-direction:column;gap:.75rem}
.faq-item{border:1px solid #e3e8f1;border-radius:14px;background:rgba(255,255,255,0.7);overflow:hidden;transition:box-shadow .2s ease,border-color .2s ease}
.faq-item:hover{border-color:#cbd7ee;box-shadow:0 6px 18px rgba(15,23,42,0.04)}
.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.95rem 1rem;border:none;background:transparent;color:#1d2736;text-align:left;font-weight:600;font-size:.96rem}
.faq-question:focus{outline:none}
.faq-question[aria-expanded="true"] .faq-chevron{transform:rotate(45deg)}
.faq-chevron{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#edf5eb;color:var(--primary);font-size:1.2rem;line-height:1;transition:transform .2s ease}
.faq-answer-wrap{border-top:1px solid #edf1f7;background:rgba(248,250,255,0.8)}
.faq-answer{padding:1rem;color:#475467;font-size:.93rem;line-height:1.6}

.container{max-width:1120px;margin:0 auto;padding:0 1rem}
.row{display:flex;flex-wrap:wrap;gap:var(--gap-lg)}
.col{flex:1 1 0}
.grid-2{display:grid;grid-template-columns:1fr 320px;gap:var(--gap-lg)}
@media (max-width: 900px){.grid-2{grid-template-columns:1fr;}}
@media (max-width: 575px){.faq-question{font-size:.88rem;padding:.8rem .8rem}.faq-answer{font-size:.88rem;padding:.85rem .8rem}}

/* Navbar */
.navbar{
  background:var(--surface);
  border-bottom: 1px solid rgba(11,18,32,0.05);
  box-shadow: 0 6px 18px rgba(11,18,32,0.03);
  padding:.5rem 0;
  position:sticky;top:0;z-index:800;
}
.navbar{
  background: var(--surface);
  border-bottom: 1px solid rgba(11,18,32,0.05);
  box-shadow: 0 6px 18px rgba(11,18,32,0.03);
  padding: .5rem 0;
  position: sticky;
  top: 0;
  z-index: 800;
}

.navbar .container{max-width:1120px; width:100%}
.navbar-brand{display:inline-flex;align-items:center;justify-content:center;padding:0;margin-right:1.5rem;line-height:1;height:72px}
.navbar-brand .brand-logo{display:block;height:120px;width:auto;max-width:340px;object-fit:contain}
.navbar-nav{display:flex;align-items:center}
.navbar .nav-item{display:flex;align-items:center}
.navbar .nav-link{color:var(--muted);padding:.5rem .7rem;border-radius:8px;text-decoration:none;display:inline-flex;align-items:center;line-height:1.2;white-space:nowrap}
.navbar .nav-link:hover{color:var(--text);background:var(--primary-soft)}
.navbar .nav-link.active{color:var(--primary);background:var(--primary-soft);font-weight:600}
.navbar .dropdown-item{line-height:1.2;padding:.6rem 1rem}
.navbar .dropdown-item.active{background:var(--primary-soft);color:var(--primary);font-weight:600}
.nav-cta{border-radius:10px;padding:.55rem .85rem;background:#fff;border:1px solid rgba(94,132,88,0.28);color:var(--primary);font-weight:600;box-shadow:none;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;line-height:1.2}
.nav-cta:hover,.nav-cta:focus{background:var(--primary);border-color:var(--primary);color:#fff;text-decoration:none;box-shadow:0 8px 20px rgba(94,132,88,0.18)}

@media (max-width: 991px){
  .navbar-brand{height:60px}
  .navbar-brand .brand-logo{height:60px;max-width:180px}
  .navbar-collapse{width:100%}
  .navbar-nav{width:100%}
  .navbar-nav.ml-auto{margin-top:.75rem}
  .navbar .nav-item{width:100%}
  .navbar .nav-link{justify-content:flex-start;width:100%}
  .nav-cta{width:auto;align-self:flex-start}
}

@media (max-width: 575px){
  .navbar .container{padding-left:.75rem;padding-right:.75rem}
  .navbar-brand{margin-right:0.75rem}
  .navbar-brand .brand-logo{height:52px;max-width:160px}
  .navbar .nav-link{padding:.45rem .55rem;font-size:.92rem}
}
.navbar .nav-links{display:flex;gap:0.75rem;align-items:center;margin-left:auto}
.navbar-toggler{margin-left:0.5rem}
.navbar .nav-link{color:var(--muted);padding:.45rem .6rem;border-radius:8px;text-decoration:none;display:inline-flex;align-items:center;line-height:1.2;white-space:nowrap}
.navbar .nav-link:hover{color:var(--text);background:var(--primary-soft)}
.navbar .nav-link.active{color:var(--primary);background:var(--primary-soft);font-weight:600}
.navbar .dropdown-item{line-height:1.2;padding:.6rem 1rem}
.navbar .dropdown-item.active{background:var(--primary-soft);color:var(--primary);font-weight:600}
.navbar-nav{display:flex;align-items:center;gap:.35rem}

/* Primary CTA in nav */
.nav-cta{border-radius:10px;padding:.5rem .9rem;background:#fff;border:1px solid rgba(94,132,88,0.28);color:var(--primary);font-weight:600;box-shadow:none;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;line-height:1.2}
.nav-cta:hover,.nav-cta:focus{background:var(--primary);border-color:var(--primary);color:#fff;text-decoration:none;box-shadow:0 8px 20px rgba(94,132,88,0.18)}


/* Mobile nav toggle */
.nav-toggle{display:none;background:transparent;border:0;padding:.3rem;margin-left:.5rem}
@media (max-width:768px){
  .nav-toggle{display:inline-flex}
  .navbar .nav-links{display:none}
}


/* Cards */
.card-soft{
  background:var(--surface);
  border-radius:var(--radius);
  padding:var(--card-padding);
  border:1px solid rgba(11,18,32,0.04);
  box-shadow: 0 6px 18px rgba(11,18,32,0.03);
  overflow:visible;
}
.card-compact{padding:.9rem}
.card-title-strong{font-size:1.05rem;font-weight:700;color:var(--text);margin:0}
.card-sub{color:var(--muted);font-size:.95rem;margin-top:.35rem}

/* Hero */
.hero-shell{padding:2rem 2rem 1.5rem}
.hero-layout{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.hero-copy{flex:1 1 0}
.hero-copy h1{font-size:3rem;line-height:1.05;letter-spacing:-0.05em;margin:0 0 .75rem}
.hero-copy .lead{font-size:1.1rem;max-width:680px;color:var(--muted);margin:0}
.cta-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.25rem}
.trust-row{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.1rem}
.trust-row span{padding:.45rem .7rem;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:.8rem;font-weight:700;letter-spacing:.02em}
.hero-visual{flex:0 0 380px;display:flex;align-items:center;justify-content:center}
.hero-visual img{width:100%;display:block;border-radius:16px;background:#edf5eb;border:1px solid rgba(94,132,88,0.06)}
.home-spotlight{display:grid;grid-template-columns:1.3fr 0.7fr;gap:1rem;width:100%;max-width:420px}
.spotlight-card{background:linear-gradient(180deg, rgba(94,132,88,0.05), rgba(255,255,255,0.9));border:1px solid rgba(94,132,88,0.09);border-radius:18px;padding:1rem;box-shadow:0 18px 38px rgba(94,132,88,0.12)}
.spotlight-main{display:flex;flex-direction:column;gap:.8rem}
.spotlight-list{display:grid;gap:.5rem}
.spotlight-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .7rem;border-radius:10px;background:rgba(255,255,255,0.6);font-size:.82rem}
.spotlight-item span{color:var(--text);font-weight:600}
.spotlight-item em{color:var(--primary);font-style:normal;font-weight:700}
.spotlight-side{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:linear-gradient(180deg, rgba(18,94,90,0.08), rgba(255,255,255,0.9));}
.spotlight-metric{display:flex;align-items:flex-end;gap:.5rem}
.spotlight-metric strong{font-size:2.1rem;line-height:1;color:var(--text)}
.spotlight-metric span{padding-bottom:.3rem;color:var(--muted)}
.spotlight-number{font-size:2.2rem;line-height:1.1;font-weight:800;color:var(--text)}
.home-steps{display:grid;gap:.8rem;margin-top:1rem}
.step-card{display:flex;align-items:flex-start;gap:.75rem;padding:.9rem;border:1px solid rgba(11,18,32,0.05);border-radius:12px;background:rgba(14,22,35,0.01)}
.step-number{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-weight:800;font-size:.9rem}
.step-card h4{margin:0 0 .2rem;font-size:1rem}
.step-card p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.5}

/* Page sections */
.section-block{margin-bottom:1.5rem}
.section-header-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.feature-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:1.5rem}
.feature-panel{min-height:100%}
.feature-list{padding-left:1.25rem;margin:0;display:grid;gap:.7rem}
.feature-list li{line-height:1.6}
.mini-list{display:grid;gap:.8rem}
.mini-card{padding:.9rem;border:1px solid rgba(11,18,32,0.04);border-radius:12px;background:rgba(11,18,32,0.01)}
.mini-topline{display:flex;justify-content:space-between;align-items:center;gap:.75rem}
.mini-title{font-weight:700;margin:.35rem 0 .15rem}
.mini-title a{color:var(--text)}
.mini-sub{font-size:.9rem;color:var(--muted);margin-bottom:.35rem}
.mini-skills{display:flex;flex-wrap:wrap;gap:.35rem}
.benefit-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:1.5rem}
.benefit-panel{min-height:100%}
.benefit-list{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.benefit-list li{position:relative;padding-left:1.1rem;line-height:1.6}
.benefit-list li:before{content:"•";position:absolute;left:0;top:0;color:var(--primary);font-weight:700}
.cta-panel{padding:1.5rem 1.25rem}
.justify-content-center{justify-content:center}

@media (max-width: 900px){
  .hero-layout{flex-direction:column;text-align:left;align-items:stretch}
  .hero-copy h1{font-size:2.4rem}
  .feature-grid,.benefit-grid{grid-template-columns:1fr}
}

/* Contribution list / card */
.list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.contribution-card{display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:1rem;border-radius:12px;background:var(--surface);transition:transform .14s ease,box-shadow .14s ease;border:1px solid rgba(11,18,32,0.03)}
.contribution-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(11,18,32,0.05)}
.contribution-meta{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.time-badge{background:var(--primary-soft);color:var(--primary);padding:.35rem .6rem;border-radius:10px;font-weight:700;font-size:.95rem}

/* Listing tabs */
.subpage-tabs{display:inline-flex;flex-wrap:wrap;gap:.5rem;padding:.35rem;border-radius:12px;background:rgba(13,23,42,0.03);border:1px solid rgba(11,18,32,0.04)}
.subpage-tab{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:.5rem .8rem;font-size:.88rem;font-weight:600;color:var(--muted);transition:all .12s ease}
.subpage-tab.active{background:var(--primary);color:#fff;box-shadow:0 8px 18px rgba(94,132,88,0.18)}
.subpage-tab:hover{background:rgba(94,132,88,0.08);color:var(--primary)}
.subpage-tab.active:hover{color:#fff;background:var(--primary-600)}

/* People directory */
.directory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.user-card{display:flex;flex-direction:column;height:100%}
.avatar-fallback{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary),#8cb38a);color:#fff;font-weight:700;letter-spacing:0.04em}
.meta-row{display:flex;flex-wrap:wrap;gap:.4rem}
.meta-pill{display:inline-flex;align-items:center;padding:.28rem .55rem;border-radius:999px;background:rgba(94,132,88,0.08);color:var(--primary);font-size:.78rem;font-weight:600}
.skill-row{display:flex;flex-wrap:wrap;gap:.3rem}
.stat-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:auto}
.stat-box{padding:.8rem;border-radius:10px;background:rgba(11,18,32,0.02);border:1px solid rgba(11,18,32,0.03)}
.metric-label{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.08em}
.metric-value{font-size:1.15rem;font-weight:700;color:var(--text);margin-top:.2rem}
.minw-0{min-width:0}

/* Skill tags */
.skill-tag{display:inline-block;background:rgba(20,27,45,0.04);padding:.25rem .6rem;border-radius:999px;margin-right:.35rem;color:var(--text);font-size:.82rem}
.badge-credit{background:var(--primary-soft);color:var(--primary);padding:.25rem .45rem;border-radius:8px;font-weight:700;font-size:.82rem}

/* Buttons */
a.btn, button.btn, .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:10px;padding:.55rem .85rem;font-weight:600;border:none;cursor:pointer;line-height:1.2;text-decoration:none;transition:all .12s ease;color:var(--text);background:transparent}
a.btn:visited, button.btn:visited, .btn:visited{color:var(--text)}
.btn:hover{text-decoration:none}
a.btn-primary, button.btn-primary, .btn-primary{background:var(--primary);color:#fff;box-shadow:0 10px 24px rgba(94,132,88,0.18)}
a.btn-primary:visited, button.btn-primary:visited, .btn-primary:visited{color:#fff}
a.btn-primary:hover, button.btn-primary:hover, .btn-primary:hover,
a.btn-primary:focus, button.btn-primary:focus, .btn-primary:focus{background:var(--primary-600);color:#fff}
a.btn-primary-main, button.btn-primary-main, .btn-primary-main{background:#fff;border:1px solid rgba(94,132,88,0.28);color:var(--primary);box-shadow:none}
a.btn-primary-main:visited, button.btn-primary-main:visited, .btn-primary-main:visited{color:var(--primary)}
a.btn-primary-main:hover, button.btn-primary-main:hover, .btn-primary-main:hover,
a.btn-primary-main:focus, button.btn-primary-main:focus, .btn-primary-main:focus{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 10px 24px rgba(94,132,88,0.18)}
a.btn-secondary, button.btn-secondary, .btn-secondary{background:var(--primary-soft);border:1px solid rgba(94,132,88,0.14);color:var(--primary);box-shadow:none}
a.btn-secondary:visited, button.btn-secondary:visited, .btn-secondary:visited{color:var(--primary)}
a.btn-secondary:hover, button.btn-secondary:hover, .btn-secondary:hover,
a.btn-secondary:focus, button.btn-secondary:focus, .btn-secondary:focus{background:var(--primary-soft-strong);border-color:rgba(94,132,88,0.2);color:var(--primary)}
.btn-outline-primary,
a.btn-outline-primary,
button.btn-outline-primary,
.btn-outline-primary:hover,
a.btn-outline-primary:hover,
button.btn-outline-primary:hover,
.btn-outline-primary:focus,
a.btn-outline-primary:focus,
button.btn-outline-primary:focus,
.btn-outline-primary:active,
a.btn-outline-primary:active,
button.btn-outline-primary:active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active {
  background: rgba(94, 132, 88, 0.08) !important;
  border-color: rgba(94,132,88,0.2) !important;
  color: var(--primary) !important;
  box-shadow: none !important;
}
a.btn-ghost, button.btn-ghost, .btn-ghost{background:transparent;border:1px solid rgba(20,27,45,0.08);color:var(--text)}
a.btn-ghost:visited, button.btn-ghost:visited, .btn-ghost:visited{color:var(--text)}
a.btn-ghost:hover, button.btn-ghost:hover, .btn-ghost:hover,
a.btn-ghost:focus, button.btn-ghost:focus, .btn-ghost:focus{background:rgba(20,27,45,0.02);color:var(--text)}
.btn-block{display:flex;width:100%}

/* Form controls */
.form-control{width:100%;box-sizing:border-box;border-radius:10px;border:1px solid rgba(11,18,32,0.06);box-shadow:none;padding:.7rem .9rem;transition:box-shadow .12s ease,border-color .12s ease;line-height:1.25}
.form-control:focus{box-shadow:0 8px 20px rgba(94,132,88,0.08);border-color:var(--primary-600);outline:none}
select.form-control{
  padding: .75rem 2.5rem .75rem .9rem;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  line-height: 1.2;
  height: 44px;
  min-height: 44px;
  display: block;
  overflow: visible;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235d6678' d='M2 4l4 4 4-4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .8rem center;
  background-size: 12px 12px;
}
select.form-control option{padding:.5rem .7rem;white-space:normal}
textarea.form-control{min-height:140px}
.form-row{display:flex;gap:.75rem}
.form-row .col{flex:1}
.field-help{font-size:.86rem;color:var(--muted);margin-top:.25rem}

/* Headings */
h1.display-4{font-size:var(--h1);font-weight:700;margin:0 0 0.5rem 0}
h2.section-head{font-size:var(--h2);font-weight:700;margin:0 0 0.5rem 0;color:var(--text)}
.lead{font-size:var(--lead);color:var(--muted)}

/* Profile */
.avatar-lg{width:120px;height:120px;border-radius:14px;object-fit:cover}
.avatar-circle{width:64px;height:64px;border-radius:50%;object-fit:cover}
.profile-quick{display:flex;gap:1rem;align-items:center}
.profile-upload-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.profile-upload-zone{flex:1 1 300px;border:1.5px dashed rgba(94,132,88,0.4);border-radius:12px;padding:1rem;cursor:pointer;background:var(--primary-soft);transition:all .12s ease}
.profile-upload-zone.dragover{background:rgba(94,132,88,0.09);border-color:var(--primary)}
.profile-upload-inner{display:flex;align-items:center;gap:.75rem}
.profile-upload-icon{width:44px;height:44px;border-radius:12px;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:700}
.profile-preview-wrap{width:64px;height:64px;border-radius:12px;overflow:hidden;border:1px solid rgba(20,27,45,0.08);background:rgba(20,27,45,0.02);display:flex;align-items:center;justify-content:center}
.profile-preview-wrap img{width:100%;height:100%;object-fit:cover;display:block}

/* Empty state */
.empty-state{background:var(--surface);border:1px solid rgba(11,18,32,0.04);padding:2rem;border-radius:12px;text-align:center;color:var(--muted)}

/* Detail layout */
.detail-grid{display:grid;grid-template-columns:1fr 320px;gap:var(--gap-lg);align-items:start}
@media (max-width:900px){.detail-grid{grid-template-columns:1fr}}
.sidebar-card{position:sticky;top:1.25rem}

/* Workspace */
.workspace-meta{background:var(--surface);padding:1rem;border-radius:10px;border:1px solid rgba(11,18,32,0.04)}

/* Utilities */
.muted-small{color:var(--muted);font-size:.9rem}
.kicker{font-size:.82rem;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.row-actions{display:flex;gap:.5rem;align-items:center}
.owner-actions-stack{display:flex;flex-direction:column;gap:.65rem;margin-top:.15rem}
.owner-action-form{margin:0}
.owner-action-form .btn{margin:0}

/* Loading skeleton (simple) */
.skeleton{background:linear-gradient(90deg, rgba(11,18,32,0.04) 25%, rgba(11,18,32,0.06) 50%, rgba(11,18,32,0.04) 75%);border-radius:8px;min-height:12px}

/* Accessibility: focus outlines */
a:focus,button:focus,input:focus,textarea:focus{box-shadow:0 0 0 3px rgba(94,132,88,0.12);outline:none}

/* Responsive tweaks */
@media (max-width: 768px){
  .container{padding:0 0.75rem}
  .navbar .nav-links{display:none}
  .mobile-actions{display:flex;gap:.5rem}
  .section-header-row{flex-direction:column;align-items:flex-start}
  h1.display-4{font-size:1.8rem}
  h2.section-head{font-size:1.35rem}
  .card-soft{padding:1rem}
}

/* Status badges */
.status-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .6rem;border-radius:999px;font-weight:700;font-size:.85rem}
.status-pill.success{background:rgba(22,163,74,0.08);color:var(--success)}
.status-pill.warn{background:rgba(245,158,11,0.06);color:var(--warning)}
.status-pill.danger{background:rgba(239,68,68,0.06);color:var(--danger)}
.status-pill.info{background:rgba(94,132,88,0.07);color:var(--primary)}

/* Small inline progress */
.progress-compact{height:10px;background:rgba(11,18,32,0.06);border-radius:999px;overflow:hidden}
.progress-compact > i{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-600));width:0%;transition:width .5s ease}

/* Toast notifications (bottom-right) */
.toast-viewport{position:fixed;right:1rem;bottom:1rem;display:flex;flex-direction:column;gap:.5rem;z-index:1200}
.toast{background:var(--surface);padding:.75rem 1rem;border-radius:10px;border:1px solid rgba(11,18,32,0.06);box-shadow:0 10px 30px rgba(11,18,32,0.06);display:flex;gap:.75rem;align-items:center;min-width:220px}
.toast.success{border-left:4px solid var(--success)}
.toast.warn{border-left:4px solid var(--warning)}
.toast.error{border-left:4px solid var(--danger)}

/* Modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(11,18,32,0.45);display:flex;align-items:center;justify-content:center;z-index:1300}
.modal-card{background:var(--surface);padding:1.25rem;border-radius:12px;max-width:720px;width:100%;box-shadow:0 30px 60px rgba(11,18,32,0.2)}

/* Tables */
.table{width:100%;border-collapse:collapse;background:transparent}
.table th{text-align:left;padding:.75rem;color:var(--muted);font-size:.9rem;border-bottom:1px solid rgba(11,18,32,0.04)}
.table td{padding:.75rem;border-bottom:1px solid rgba(11,18,32,0.03)}
.table tr:hover td{background:rgba(11,18,32,0.02)}

/* Form validation states */
.input-error{border-color:rgba(239,68,68,0.12);box-shadow:0 6px 18px rgba(239,68,68,0.06)}
.field-error{color:var(--danger);font-size:.85rem;margin-top:.35rem}

/* Avatar ring when online/verified */
.avatar-ring{position:relative;display:inline-block}
.avatar-ring img{display:block;border-radius:10px}
.avatar-ring .status-dot{position:absolute;right:-6px;bottom:-6px;width:14px;height:14px;border-radius:50%;border:2px solid var(--surface)}
.avatar-ring .status-dot.online{background:var(--success)}
.avatar-ring .status-dot.offline{background:rgba(11,18,32,0.12)}
.avatar-ring .status-dot.verified{background:linear-gradient(90deg,var(--primary),var(--primary-600))}

/* Chips / selectable tags */
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{padding:.35rem .6rem;border-radius:999px;border:1px solid rgba(11,18,32,0.06);background:rgba(11,18,32,0.02);cursor:pointer}
.chip.selected{background:var(--primary);color:#fff;border-color:var(--primary)}

/* Tooltip (pure CSS) */
.tooltip{position:relative;display:inline-block}
.tooltip .tooltip-text{visibility:hidden;opacity:0;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);background:var(--text);color:#fff;padding:.4rem .6rem;border-radius:6px;font-size:.82rem;white-space:nowrap;transition:opacity .12s,transform .12s}
.tooltip:hover .tooltip-text{visibility:visible;opacity:1;transform:translateX(-50%) translateY(0)}

/* Compact list separators */
.list-compact{list-style:none;margin:0;padding:0}
.list-compact li{padding:.65rem 0;border-bottom:1px solid rgba(11,18,32,0.04)}
.list-compact li:last-child{border-bottom:0}

/* Mobile bottom nav */
.mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid rgba(11,18,32,0.06);display:flex;justify-content:space-around;padding:.5rem 0;z-index:900}
.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;color:var(--muted);font-size:.82rem;text-decoration:none}
.mobile-bottom-nav a.active{color:var(--primary)}

/* small utilities */
.text-muted{color:var(--muted)}
.small{font-size:.86rem}

/* end of additions */