@import url("/assets/ui-kit.css");

/* ==========================================================================
   KCEP Platform — application-specific layout layer
   ========================================================================== */

.top-brand {
  display: inline-flex;
  align-items: baseline;
  gap: 11px;
}
.top-brand strong {
  color: #fff;
  font-size: 14px;
  font-weight: 820;
  letter-spacing: -.035em;
}
.top-brand span {
  color: #aeb9b6;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .22em;
}

.projects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 15px;
}
.project-card {
  min-height: 205px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
  transition: transform var(--kcep-normal), box-shadow var(--kcep-normal), border-color var(--kcep-normal);
}
.project-card:hover {
  transform: translateY(-2px);
  border-color: var(--kcep-border-strong);
  box-shadow: var(--kcep-shadow-sm);
}
.project-card h2 { margin: 15px 0 4px; font-size: 19px; }
.project-card p { margin: 0; color: var(--kcep-text-2); }
.project-desc { min-height: 38px; margin-top: 9px !important; }
.project-card-top,
.project-card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.project-card-bottom { margin-top: auto; padding-top: 15px; }
.project-card-bottom small { color: var(--kcep-muted); font-size: 10px; }

.filter-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 16px;
}
.search { min-width: 250px; flex: 1; }

.admin-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.panel { padding: 18px; margin-bottom: 16px; }
.simple-list { display: grid; gap: 7px; margin-top: 13px; }
.simple-list > div {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding: 8px 0;
  border-bottom: 1px solid #edf0ef;
}
.simple-list small { color: var(--kcep-muted); }

.access-user { padding: 16px 0; border-top: 1px solid var(--kcep-border); }
.access-user-head {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 9px;
}
.access-user-head span { color: var(--kcep-muted); }
.access-grid { display: grid; gap: 6px; }
.access-row {
  display: grid;
  grid-template-columns: 1fr 180px;
  align-items: center;
  gap: 12px;
  padding: 7px 9px;
  border-radius: var(--kcep-r-md);
  background: var(--kcep-surface-2);
}

.project-main { padding: 28px; min-width: 0; }
.overview-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 13px;
  margin-bottom: 16px;
}

.auth-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 25% 20%, rgba(103,201,74,.08), transparent 34%),
    var(--kcep-black);
}
.auth-card {
  width: min(410px, calc(100vw - 30px));
  padding: 30px;
  border-radius: var(--kcep-r-xl);
  background: #fff;
  box-shadow: var(--kcep-shadow-modal);
}
.brand {
  font-size: 54px;
  line-height: 1;
  font-weight: 840;
  letter-spacing: -.06em;
}
.brand-sub {
  margin: 7px 0 28px;
  color: #4f5b58;
  font-size: 9px;
  font-weight: 620;
  letter-spacing: .33em;
}

.icon-btn {
  width: 33px;
  height: 33px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--kcep-muted);
  font-size: 23px;
  cursor: pointer;
}
.icon-btn:hover { background: var(--kcep-surface-3); color: var(--kcep-text); }

/* UI Kit styleguide only */
.ui-kit-layout {
  display: grid;
  grid-template-columns: 190px minmax(0,1fr);
  min-height: calc(100vh - 58px);
}
.ui-kit-nav {
  padding: 18px 10px;
  background: #111918;
  color: #aebbb7;
}
.ui-kit-nav strong {
  display: block;
  padding: 6px 9px 14px;
  color: #fff;
}
.ui-kit-nav a {
  display: block;
  padding: 7px 9px;
  border-radius: 6px;
  color: #aebbb7;
  text-decoration: none;
}
.ui-kit-nav a:hover { background: rgba(255,255,255,.05); color: #fff; }
.ui-kit-main {
  width: min(1050px, calc(100% - 42px));
  margin: 28px auto 60px;
}
.ui-kit-section {
  padding: 26px 0;
  border-bottom: 1px solid var(--kcep-border);
}
.ui-kit-section > h2 { margin-bottom: 15px; }
.ui-kit-demo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.ui-kit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(210px,1fr));
  gap: 12px;
}
.ui-token {
  min-height: 72px;
  padding: 12px;
  border: 1px solid var(--kcep-border);
  border-radius: 9px;
  background: #fff;
}
.ui-swatch {
  height: 35px;
  margin-bottom: 8px;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 6px;
}

@media(max-width: 800px) {
  .admin-grid,.overview-grid { grid-template-columns: 1fr; }
  .project-main { padding: 20px; }
  .access-row { grid-template-columns: 1fr; }
  .ui-kit-layout { grid-template-columns: 1fr; }
  .ui-kit-nav { display: none; }
}


/* v0.3.3 — Project Metadata / richer Overview */
.project-settings-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.field-span-2 { grid-column:1 / -1; }

.project-hero {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px;
}
.project-hero h1 { margin-top:5px; }
.project-hero p { margin:7px 0 0;color:var(--kcep-muted);font-size:15px; }
.project-hero-actions { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }

.overview-grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.metric-card small { color:var(--kcep-muted);font-size:10px; }

.overview-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}
.project-health-list { display:grid;gap:1px;border:1px solid var(--kcep-border);border-radius:9px;overflow:hidden; }
.project-health-list>div {
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 11px;background:var(--kcep-surface-2);border-bottom:1px solid var(--kcep-border);
}
.project-health-list>div:last-child { border-bottom:0; }
.project-health-list strong { color:var(--kcep-success); }

.overview-next-copy { color:var(--kcep-text-2);margin:0 0 18px; }
.overview-next-actions { justify-content:flex-start; }

.project-details-card { margin-top:14px; }
.project-details {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  margin:0;
  border:1px solid var(--kcep-border);
  border-radius:9px;
  overflow:hidden;
}
.project-details>div { padding:12px 13px;background:#fff;border-bottom:1px solid var(--kcep-border); }
.project-details>div:nth-child(odd) { border-right:1px solid var(--kcep-border); }
.project-details>div:last-child,
.project-details>div:nth-last-child(2) { border-bottom:0; }
.project-details dt { color:var(--kcep-muted);font-size:10px;font-weight:720;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px; }
.project-details dd { margin:0;color:var(--kcep-text);font-weight:600; }
.project-details .details-wide { grid-column:1/-1;border-right:0!important; }

.project-card-meta { display:flex;flex-wrap:wrap;gap:6px;margin-top:10px; }
.project-card-meta span {
  display:inline-flex;padding:4px 7px;border-radius:6px;background:#f1f4f3;color:var(--kcep-muted);font-size:9px;font-weight:650;
}

@media(max-width:1000px){
  .overview-grid-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .project-settings-grid,.overview-columns,.overview-grid-4,.project-details{grid-template-columns:1fr}
  .field-span-2,.project-details .details-wide{grid-column:auto}
  .project-details>div{border-right:0!important}
  .project-hero{flex-direction:column}
}


/* ==========================================================================
   v0.4.5 — KCEP LOGIN
   Cinematic stage / glassmorphism / animated perimeter
   ========================================================================== */

.auth-page.auth-stage{
  position:relative;
  min-height:100svh;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#020407;
  color:#fff;
  isolation:isolate;
}

.auth-scene{
  position:fixed;
  inset:0;
  z-index:-3;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 10%,rgba(71,99,145,.14),transparent 27%),
    linear-gradient(180deg,#020407 0%,#050812 47%,#08080d 70%,#060607 100%);
}

.auth-scene::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 45%,transparent 0 34%,rgba(0,0,0,.18) 70%,rgba(0,0,0,.62) 100%),
    linear-gradient(90deg,rgba(0,0,0,.48),transparent 22% 78%,rgba(0,0,0,.48));
}

.auth-spotlights{
  position:absolute;
  top:-14px;
  left:50%;
  width:min(760px,68vw);
  height:62vh;
  transform:translateX(-50%);
  display:flex;
  justify-content:space-between;
  pointer-events:none;
}

.auth-spotlights i{
  position:relative;
  display:block;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#eaf6ff;
  box-shadow:
    0 0 8px #fff,
    0 0 18px rgba(124,181,255,.8),
    0 0 28px rgba(124,181,255,.25);
}

.auth-spotlights i::after{
  content:"";
  position:absolute;
  top:12px;
  left:50%;
  width:180px;
  height:58vh;
  transform:translateX(-50%);
  transform-origin:top;
  clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);
  background:linear-gradient(180deg,rgba(189,220,255,.22),rgba(96,149,220,.07) 54%,transparent 100%);
  filter:blur(7px);
}

.auth-spotlights i:nth-child(1)::after{transform:translateX(-50%) rotate(10deg)}
.auth-spotlights i:nth-child(2)::after{transform:translateX(-50%) rotate(5deg)}
.auth-spotlights i:nth-child(4)::after{transform:translateX(-50%) rotate(-5deg)}
.auth-spotlights i:nth-child(5)::after{transform:translateX(-50%) rotate(-10deg)}

.auth-side{
  position:absolute;
  top:18%;
  bottom:9%;
  width:min(260px,24vw);
  opacity:.8;
  filter:drop-shadow(0 0 22px rgba(64,104,255,.15));
}

.auth-side::before,
.auth-side::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      180deg,
      transparent 0 66px,
      rgba(75,162,255,.96) 68px 72px,
      transparent 74px 130px
    );
  clip-path:polygon(0 10%,55% 0,100% 15%,88% 100%,0 90%);
  filter:drop-shadow(0 0 7px rgba(66,165,255,.75));
}

.auth-side::after{
  opacity:.23;
  transform:scaleX(.72) translateX(24%);
  filter:blur(3px);
}

.auth-side-left{left:-70px}
.auth-side-right{right:-70px;transform:scaleX(-1);filter:hue-rotate(55deg) drop-shadow(0 0 22px rgba(161,59,255,.18))}

.auth-floor{
  position:absolute;
  left:-10vw;
  right:-10vw;
  bottom:-12vh;
  height:48vh;
  transform:perspective(620px) rotateX(61deg);
  transform-origin:bottom center;
  background:
    linear-gradient(90deg,transparent 49.75%,rgba(75,135,228,.22) 50%,transparent 50.25%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 74px),
    repeating-linear-gradient(180deg,rgba(82,128,205,.12) 0 2px,transparent 2px 52px),
    linear-gradient(180deg,rgba(14,26,42,.82),#090909 52%,#070707);
  box-shadow:inset 0 40px 100px rgba(58,126,255,.08);
  opacity:.95;
}

.auth-floor::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(38,124,255,.16),transparent 32% 68%,rgba(131,59,255,.16)),
    radial-gradient(ellipse at 50% 5%,rgba(255,156,100,.09),transparent 35%);
}

.auth-shell{
  width:min(620px,calc(100vw - 32px));
  min-height:100svh;
  padding:42px 0 30px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:24px;
}

.auth-logo{
  display:grid;
  justify-items:center;
  gap:8px;
  color:#fff;
  text-decoration:none;
  filter:drop-shadow(0 3px 18px rgba(0,0,0,.55));
}

.auth-logo-main{
  display:flex;
  align-items:baseline;
  font-size:58px;
  line-height:.84;
  letter-spacing:-.06em;
}

.auth-logo-main b{
  font-weight:880;
  font-style:normal;
}

.auth-logo-main i{
  font-weight:760;
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.94);
}

.auth-logo-sub{
  color:#d7dce4;
  font-size:8px;
  font-weight:650;
  letter-spacing:.36em;
  white-space:nowrap;
}

.auth-glass-card{
  position:relative;
  width:min(520px,100%);
  padding:38px 42px 30px;
  border-radius:28px;
  border:1px solid rgba(138,167,214,.26);
  background:
    linear-gradient(145deg,rgba(20,26,39,.67),rgba(12,12,22,.72));
  box-shadow:
    0 30px 90px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(22px) saturate(125%);
  -webkit-backdrop-filter:blur(22px) saturate(125%);
  overflow:hidden;
}

.auth-glass-card::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:27px;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 8%,rgba(89,162,255,.10),transparent 25%),
    radial-gradient(circle at 88% 88%,rgba(157,73,255,.10),transparent 28%);
}

.auth-card-border{
  position:absolute;
  z-index:0;
  inset:-2px;
  border-radius:30px;
  padding:2px;
  pointer-events:none;
  background:conic-gradient(
    from var(--auth-border-angle,0deg),
    transparent 0deg 44deg,
    rgba(78,172,255,.12) 65deg,
    #66c7ff 88deg,
    #d8f5ff 95deg,
    #4678ff 102deg,
    rgba(92,116,255,.10) 132deg,
    transparent 165deg 225deg,
    rgba(145,83,255,.12) 245deg,
    #9e5cff 270deg,
    #f3d7ff 278deg,
    #6e3dff 286deg,
    rgba(137,76,255,.10) 310deg,
    transparent 340deg 360deg
  );
  animation:authPerimeterRun 5.8s linear infinite;
  opacity:.92;

  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
}

@property --auth-border-angle{
  syntax:"<angle>";
  inherits:false;
  initial-value:0deg;
}

@keyframes authPerimeterRun{
  to{--auth-border-angle:360deg}
}

.auth-glass-card.is-interacting .auth-card-border{
  animation-duration:16s;
  opacity:.42;
}

.auth-glass-card.is-submitting .auth-card-border{
  animation-duration:1.2s;
  opacity:1;
}

.auth-lock-icon,
.auth-heading,
.auth-error,
.auth-form,
.auth-security,
.auth-admin-note{
  position:relative;
  z-index:2;
}

.auth-lock-icon{
  width:58px;
  height:58px;
  margin:0 auto 23px;
  display:grid;
  place-items:center;
  border:1px solid rgba(104,117,255,.4);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(38,87,176,.23),rgba(82,32,148,.20));
  box-shadow:
    inset 0 0 18px rgba(79,100,255,.12),
    0 0 24px rgba(73,92,255,.08);
}

.auth-lock-icon svg{
  width:27px;
  height:27px;
  fill:none;
  stroke:#687cff;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-heading{
  text-align:center;
  margin-bottom:28px;
}

.auth-heading h1{
  color:#fff;
  font-size:25px;
  line-height:1.18;
  font-weight:760;
  letter-spacing:-.035em;
}

.auth-heading p{
  margin:9px 0 0;
  color:#8d98aa;
  font-size:13px;
}

.auth-error{
  margin:-10px 0 18px;
  padding:10px 12px;
  border:1px solid rgba(255,104,124,.33);
  border-radius:9px;
  background:rgba(121,24,45,.22);
  color:#ffb2bf;
  font-size:12px;
}

.auth-form{
  display:grid;
  gap:17px;
}

.auth-field{
  display:grid;
  gap:7px;
  color:#aeb7c6;
  font-size:12px;
  font-weight:570;
}

.auth-input-wrap{
  min-height:54px;
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:0 15px;
  border:1px solid rgba(133,150,181,.27);
  border-radius:12px;
  background:rgba(7,10,17,.34);
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.auth-input-wrap:focus-within{
  border-color:rgba(86,181,255,.72);
  background:rgba(9,13,23,.52);
  box-shadow:
    0 0 0 3px rgba(68,133,255,.08),
    0 0 24px rgba(47,129,255,.09);
}

.auth-input-wrap > svg,
.auth-password-toggle svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:#8d98aa;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-input-wrap input{
  width:100%;
  min-width:0;
  height:52px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#f6f8fb;
  font-size:14px;
}

.auth-input-wrap input::placeholder{
  color:#626d7f;
}

.auth-password-toggle{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  cursor:pointer;
}

.auth-password-toggle:hover{
  background:rgba(255,255,255,.04);
}

.auth-password-toggle .eye-closed{display:none}
.auth-password-toggle[aria-pressed="true"] .eye-open{display:none}
.auth-password-toggle[aria-pressed="true"] .eye-closed{display:block}

.auth-submit{
  position:relative;
  min-height:56px;
  margin-top:7px;
  border:0;
  border-radius:13px;
  overflow:hidden;
  background:
    linear-gradient(95deg,#377bdf 0%,#4f69e8 42%,#7a35d7 100%);
  color:#fff;
  font-weight:720;
  font-size:14px;
  cursor:pointer;
  box-shadow:
    0 10px 30px rgba(66,74,217,.20),
    inset 0 1px 0 rgba(255,255,255,.2);
  transition:
    transform .16s ease,
    filter .16s ease,
    box-shadow .16s ease;
}

.auth-submit::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.24) 50%,transparent 75%);
  transform:translateX(-120%);
  transition:transform .5s ease;
}

.auth-submit:hover{
  filter:brightness(1.08);
  transform:translateY(-1px);
  box-shadow:
    0 15px 34px rgba(66,74,217,.28),
    inset 0 1px 0 rgba(255,255,255,.24);
}

.auth-submit:hover::after{
  transform:translateX(120%);
}

.auth-submit:active{
  transform:translateY(0);
}

.auth-security{
  margin-top:23px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#7f8a9a;
  font-size:11px;
}

.auth-security svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:#8793a6;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.auth-admin-note{
  margin:10px 0 0;
  text-align:center;
  color:#5d6879;
  font-size:10px;
}

.auth-footer{
  margin-top:2px;
  color:#5f6878;
  font-size:10px;
}

@media (prefers-reduced-motion:reduce){
  .auth-card-border{
    animation:none;
    background:linear-gradient(90deg,#4d9eff,#8551ef);
  }
  .auth-submit,
  .auth-input-wrap{
    transition:none;
  }
}

@media(max-width:660px){
  .auth-shell{
    justify-content:center;
    padding:24px 0;
    gap:20px;
  }

  .auth-logo-main{font-size:46px}
  .auth-logo-sub{
    font-size:6.5px;
    letter-spacing:.3em;
  }

  .auth-glass-card{
    padding:30px 22px 24px;
    border-radius:23px;
  }

  .auth-card-border{border-radius:25px}
  .auth-heading h1{font-size:22px}
  .auth-side{opacity:.48}
  .auth-spotlights{width:92vw}
  .auth-spotlights i:nth-child(2),
  .auth-spotlights i:nth-child(4){display:none}
}

@media(max-height:720px) and (min-width:661px){
  .auth-shell{
    justify-content:flex-start;
    padding-top:22px;
    gap:14px;
  }
  .auth-logo-main{font-size:44px}
  .auth-glass-card{padding:24px 36px 22px}
  .auth-lock-icon{margin-bottom:14px}
  .auth-heading{margin-bottom:18px}
  .auth-footer{margin-top:0}
}


/* ==========================================================================
   v0.4.6 — USER MANAGEMENT
   ========================================================================== */

.admin-users-shell,
.admin-user-detail-shell,
.admin-dashboard-shell{
  max-width:1320px;
}

.admin-user-head,
.admin-user-detail-head{
  align-items:center;
}

.admin-stat-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:16px;
}

.admin-stat{
  display:grid;
  gap:4px;
  min-height:96px;
  padding:16px 18px;
  border:1px solid #dce2df;
  border-radius:12px;
  background:#fff;
}

.admin-stat span{
  color:#78837f;
  font-size:10px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.admin-stat strong{
  color:#17201e;
  font-size:27px;
  line-height:1;
  letter-spacing:-.04em;
}

.admin-stat small{
  color:#929c98;
  font-size:10px;
}

.admin-users-panel{
  padding:0;
  overflow:hidden;
}

.admin-users-toolbar{
  padding:13px;
  border-bottom:1px solid #e0e5e3;
}

.admin-user-search{
  display:grid;
  grid-template-columns:minmax(220px,1fr) 180px auto;
  gap:8px;
}

.admin-user-search input,
.admin-user-search select{
  min-height:38px;
  border:1px solid #d7ddda;
  border-radius:8px;
  background:#fff;
  padding:0 11px;
}

.admin-user-list{
  display:grid;
}

.admin-user-card{
  display:grid;
  grid-template-columns:42px minmax(180px,1.4fr) minmax(130px,.8fr) 100px 68px 80px 20px;
  align-items:center;
  gap:12px;
  min-height:68px;
  padding:10px 14px;
  border-bottom:1px solid #e8ecea;
  color:#17201e;
  text-decoration:none;
  transition:background .14s ease;
}

.admin-user-card:last-child{border-bottom:0}
.admin-user-card:hover{background:#f7f9f8}

.admin-user-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#13201d;
  color:#91df72;
  font-size:14px;
  font-weight:800;
}

.admin-user-avatar.large{
  width:54px;
  height:54px;
  border-radius:14px;
  font-size:20px;
}

.admin-user-identity{
  display:grid;
  gap:2px;
  min-width:0;
}

.admin-user-identity strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.admin-user-identity small,
.admin-user-org,
.admin-user-access{
  color:#7b8682;
  font-size:10px;
}

.admin-user-role{
  display:inline-flex;
  justify-content:center;
  padding:4px 6px;
  border-radius:5px;
  background:#eef2f0;
  color:#64706c;
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
}

.admin-user-role.admin{
  background:#17261f;
  color:#8ddd72;
}

.admin-user-arrow{
  color:#a3ada9;
  font-size:22px;
  text-align:right;
}

.admin-modal[hidden]{display:none}

.admin-modal{
  position:fixed;
  inset:0;
  z-index:200;
  display:grid;
  place-items:center;
  padding:20px;
}

.admin-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(5,11,10,.67);
  backdrop-filter:blur(5px);
}

.admin-modal-card{
  position:relative;
  width:min(560px,100%);
  max-height:calc(100vh - 40px);
  overflow:auto;
  padding:22px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:15px;
  background:#fff;
  box-shadow:0 28px 90px rgba(0,0,0,.28);
}

body.modal-open{overflow:hidden}

.two-col-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.admin-password-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
}

.admin-user-title{
  display:flex;
  align-items:center;
  gap:13px;
}

.admin-user-title-status{
  display:flex;
  align-items:center;
  gap:7px;
}

.admin-user-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}

.admin-security-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:16px;
}

.admin-security-meta>div{
  display:grid;
  gap:4px;
  padding:11px;
  border:1px solid #e1e6e3;
  border-radius:8px;
  background:#f8faf9;
}

.admin-security-meta span{
  color:#87918e;
  font-size:9px;
}

.admin-security-meta strong{
  font-size:11px;
}

.admin-password-reset{
  padding-top:14px;
  border-top:1px solid #e4e8e6;
}

.admin-danger-zone{
  margin-top:17px;
  padding-top:15px;
  border-top:1px solid #eadfde;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
}

.admin-danger-zone>div{
  display:grid;
  gap:3px;
}

.admin-danger-zone span{
  color:#89938f;
  font-size:10px;
}

.button.danger{
  border-color:#d5a5a5!important;
  background:#fff4f4!important;
  color:#a63737!important;
}

.admin-project-access-panel{
  overflow:hidden;
}

.admin-project-access-list{
  display:grid;
  border:1px solid #e0e5e2;
  border-radius:9px;
  overflow:hidden;
}

.admin-project-access-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  align-items:center;
  gap:14px;
  padding:10px 12px;
  border-bottom:1px solid #e6eae8;
}

.admin-project-access-row:last-child{border-bottom:0}

.admin-project-access-row>div{
  display:grid;
  gap:2px;
}

.admin-project-access-row small{
  color:#89938f;
  font-size:9px;
}

.admin-project-access-row select{
  min-height:34px;
  border:1px solid #d8dfdb;
  border-radius:7px;
  background:#fff;
  padding:0 8px;
}

.admin-project-access-save{
  display:flex;
  justify-content:flex-end;
  margin-top:12px;
}

.admin-all-projects-note{
  padding:16px;
  border:1px solid #cfe5c8;
  border-radius:9px;
  background:#f3fbf0;
  color:#3f7d30;
  font-size:12px;
  font-weight:700;
}

.admin-module-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:13px;
}

.admin-module-card{
  min-height:130px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:18px;
  border:1px solid #dce3df;
  border-radius:13px;
  background:#fff;
  color:#18211f;
  text-decoration:none;
}

.admin-module-card.featured:hover{
  border-color:#adc7a4;
  box-shadow:0 9px 26px rgba(21,39,33,.07);
}

.admin-module-card.disabled{
  opacity:.55;
}

.admin-module-card>span:nth-child(2){
  display:grid;
  gap:5px;
}

.admin-module-card small{
  color:#87918d;
  font-size:10px;
  line-height:1.4;
}

.admin-module-card>b{
  color:#9ca6a2;
  font-size:12px;
  font-weight:600;
}

.admin-module-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#12201d;
  color:#8cda70;
  font-size:20px;
}

.empty-state{
  padding:30px;
  text-align:center;
  color:#89938f;
}

@media(max-width:950px){
  .admin-user-card{
    grid-template-columns:42px minmax(160px,1fr) 80px 75px 20px;
  }
  .admin-user-org,.admin-user-access{display:none}
  .admin-user-detail-grid{grid-template-columns:1fr}
  .admin-module-grid{grid-template-columns:1fr}
}

@media(max-width:680px){
  .admin-stat-grid{grid-template-columns:1fr}
  .admin-user-search{grid-template-columns:1fr}
  .admin-user-card{
    grid-template-columns:38px minmax(0,1fr) auto;
  }
  .admin-user-role,.admin-user-card>.status-badge,.admin-user-arrow{display:none}
  .two-col-form{grid-template-columns:1fr}
  .admin-security-meta{grid-template-columns:1fr}
  .admin-project-access-row{grid-template-columns:1fr}
  .admin-user-detail-head{align-items:flex-start}
  .admin-user-title-status{margin-top:8px}
}


/* v0.4.7 — Organizations Management */
.admin-org-card{
  grid-template-columns:42px minmax(180px,1.4fr) 110px 100px 110px 20px;
}

.admin-org-inline-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
}

.admin-inline-org-create{
  padding:11px;
  border:1px solid #dfe5e2;
  border-radius:9px;
  background:#f7f9f8;
}

.admin-linked-list{
  display:grid;
  border:1px solid #e0e5e2;
  border-radius:9px;
  overflow:hidden;
}

.admin-linked-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:10px 12px;
  border-bottom:1px solid #e7ebe9;
  color:#18211f;
  text-decoration:none;
}

.admin-linked-row:last-child{border-bottom:0}
.admin-linked-row:hover{background:#f8faf9}

.admin-linked-row>span:first-child{
  display:grid;
  gap:2px;
}

.admin-linked-row small{
  color:#8c9692;
  font-size:9px;
}

@media(max-width:900px){
  .admin-org-card{
    grid-template-columns:42px minmax(0,1fr) 100px 20px;
  }
  .admin-org-card .admin-user-org,
  .admin-org-card .admin-user-access{display:none}
}


/* ==========================================================================
   v0.4.8 — PROJECT CONTACTS
   ========================================================================== */

.contacts-stats{margin-bottom:14px}

.contacts-panel{
  padding:0;
  overflow:hidden;
}

.contacts-toolbar{
  padding:12px;
  border-bottom:1px solid #e2e7e4;
}

.contacts-filter-form{
  display:grid;
  grid-template-columns:minmax(220px,1fr) 210px auto;
  gap:8px;
}

.contacts-filter-form input,
.contacts-filter-form select,
.contact-form-grid input,
.contact-form-grid select,
.contact-form-grid textarea{
  width:100%;
  min-height:38px;
  border:1px solid #d8dfdb;
  border-radius:8px;
  background:#fff;
  padding:8px 10px;
  color:#17201e;
}

.contacts-list{display:grid}

.contact-card{
  display:grid;
  grid-template-columns:42px minmax(180px,1.25fr) minmax(180px,1fr) 140px auto;
  align-items:center;
  gap:12px;
  padding:11px 13px;
  border-bottom:1px solid #e8ecea;
  background:#fff;
}

.contact-card:last-child{border-bottom:0}
.contact-card.primary-contact{background:#fbfef9}

.contact-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#12201d;
  color:#8ddc70;
  font-size:14px;
  font-weight:800;
}

.contact-main{
  display:grid;
  gap:2px;
  min-width:0;
}

.contact-title-row{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.contact-main>span{
  color:#67736f;
  font-size:10px;
}

.contact-main>small{
  color:#8e9894;
  font-size:9px;
}

.contact-links{
  display:grid;
  gap:3px;
  min-width:0;
}

.contact-links a{
  color:#3b665a;
  font-size:10px;
  text-decoration:none;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.contact-links a:hover{text-decoration:underline}

.contact-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.contact-form-grid label{
  display:grid;
  gap:5px;
  color:#66736f;
  font-size:10px;
  font-weight:650;
}

.contact-modal-card{width:min(680px,100%)}

.contact-edit-panel{margin-top:14px}

.contact-delete-form{
  margin-top:18px;
}

@media(max-width:1050px){
  .contact-card{
    grid-template-columns:42px minmax(180px,1fr) 130px auto;
  }
  .contact-links{display:none}
}

@media(max-width:760px){
  .contacts-filter-form,
  .contact-form-grid{
    grid-template-columns:1fr;
  }
  .contact-form-grid .field-span-2{grid-column:auto}
  .contact-card{
    grid-template-columns:38px minmax(0,1fr) auto;
  }
  .contact-card>.kcep-badge{display:none}
}