:root{
  --bg:#07111f;
  --bg-deep:#040a12;
  --panel:#101c2c;
  --panel-2:#14243a;
  --panel-3:#0b1726;
  --text:#f5f8fc;
  --muted:#9cafc5;
  --muted-2:#748aa2;
  --line:#26384f;
  --line-strong:#34506f;
  --accent:#4f8cff;
  --accent-2:#7c68ff;
  --success:#5bd984;
  --danger:#ff9292;
  --warning:#ffd277;
  --shadow:0 24px 70px rgba(0,0,0,.28);
  --radius-lg:22px;
  --radius-md:14px;
  --radius-sm:10px;
}
*{box-sizing:border-box}
html{color-scheme:dark;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 18% -8%,rgba(55,105,176,.24),transparent 34rem),
    radial-gradient(circle at 100% 0,rgba(92,72,190,.12),transparent 34rem),
    linear-gradient(180deg,var(--bg) 0,var(--bg-deep) 100%);
  color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.14;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom,black,transparent 65%);
}
::selection{background:rgba(79,140,255,.32);color:white}
button,input,select{font:inherit}
button,a,input,select{transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.55}
a{color:inherit}
.hidden{display:none!important}
.shell{position:relative;width:min(1180px,calc(100% - 32px));margin:0 auto;padding:42px 0 80px}
.login-card{
  width:min(480px,100%);
  margin:7vh auto;
  background:linear-gradient(180deg,rgba(17,31,49,.98),rgba(11,22,36,.98));
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:32px;
  box-shadow:var(--shadow);
}
.brand{display:flex;align-items:center;gap:13px;min-width:0}
.brand-logo{
  width:46px;
  height:46px;
  flex:0 0 46px;
  object-fit:contain;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}
.brand .mark{
  width:46px;height:46px;border-radius:12px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  display:grid;place-items:center;font-weight:900
}
.brand strong,.brand span{display:block}
.brand strong{font-size:16px;letter-spacing:-.15px}
.brand span{color:var(--muted);font-size:13px;margin-top:2px}
h1{font-size:clamp(32px,4vw,42px);letter-spacing:-1.35px;line-height:1.05;margin:30px 0 10px}
h2{letter-spacing:-.45px}
.muted{color:var(--muted);line-height:1.55}
label{display:grid;gap:7px;margin:18px 0;color:#c9d5e4;font-size:14px;font-weight:600}
input,select{
  width:100%;
  border:1px solid var(--line);
  background:#091524;
  color:white;
  border-radius:11px;
  padding:13px 14px;
  outline:none;
}
input::placeholder{color:#61758d}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,140,255,.14)}
button,.launch{
  border:1px solid transparent;
  border-radius:10px;
  padding:11px 16px;
  font:inherit;
  font-weight:750;
  cursor:pointer;
  background:linear-gradient(135deg,var(--accent),#5b80ff);
  color:white;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}
button:hover:not(:disabled),.launch:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(44,100,220,.2)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(121,167,255,.42);outline-offset:2px}
.ghost{
  background:rgba(8,19,32,.35);
  border-color:var(--line);
  color:#dce7f5
}
.ghost:hover{background:#102039;border-color:var(--line-strong)}
.buttons{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:22px;flex-wrap:wrap}
.status{margin-top:16px;color:var(--muted);min-height:20px;line-height:1.45}
.danger{color:var(--danger)!important}
.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding-bottom:28px;
  border-bottom:1px solid rgba(255,255,255,.08)
}
.hero{padding:46px 0 22px}
.hero h1{margin:4px 0 8px}
.eyebrow{font-size:11px;letter-spacing:2.2px;color:#82adff;font-weight:850;text-transform:uppercase}
.app-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin-top:20px}
.app-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(21,38,61,.98),rgba(12,24,39,.98));
  border:1px solid var(--line);
  border-radius:20px;
  padding:24px;
  min-height:244px;
  display:flex;
  flex-direction:column;
  box-shadow:0 18px 48px rgba(0,0,0,.2)
}
.app-card:before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,var(--accent),transparent 65%);
  opacity:.9
}
.app-card:hover{border-color:#365576;transform:translateY(-2px);box-shadow:0 24px 58px rgba(0,0,0,.28)}
.app-icon{
  width:58px;height:58px;border-radius:16px;
  background:linear-gradient(145deg,#1b3f6c,#172b49);
  border:1px solid #315074;
  display:grid;place-items:center;
  font-size:17px;font-weight:900;letter-spacing:.5px;
  box-shadow:inset 0 1px rgba(255,255,255,.07)
}
.app-card[data-app="herdtrack"] .app-icon{background:linear-gradient(145deg,#304326,#1d2d1a);border-color:#486640;color:#b9e89f}
.app-card[data-app="farmflow"] .app-icon{background:linear-gradient(145deg,#244d37,#183426);border-color:#3f7656;color:#c9f4d9}
.app-card[data-app="admin-console"] .app-icon{background:linear-gradient(145deg,#413667,#282345);border-color:#5d4d8c;color:#d5c8ff}
.app-card[data-app="lead-radar"] .app-icon{background:linear-gradient(145deg,#214b55,#17313b);border-color:#37717c;color:#b9edf1}
.app-card h2{margin:20px 0 7px;font-size:22px}
.app-card p{color:var(--muted);line-height:1.55;margin:0 0 24px}
.app-card .launch{margin-top:auto;align-self:flex-start}
.soon{opacity:.58}.soon .launch{pointer-events:none;background:#334158}
.login-help{display:flex;justify-content:flex-end;margin-top:-8px}
.forgot-link{color:#9cbbff;text-decoration:none;font-size:13px}
.forgot-link:hover{text-decoration:underline}
.account-nav{text-decoration:none}
.portal-home-link{display:inline-block;margin-top:14px;color:#9cbbff;text-decoration:none;font-size:13px;font-weight:700}.portal-home-link:hover{text-decoration:underline}
.portal-note{font-size:13px;color:var(--muted-2)}
@media(max-width:760px){
  .shell{width:min(100% - 22px,1180px);padding:22px 0 56px}
  .topbar{align-items:flex-start;flex-direction:column}
  .topbar .buttons{width:100%;justify-content:flex-start;margin-top:0}
  .hero{padding-top:34px}
}
@media(max-width:520px){
  .login-card{padding:24px;margin:4vh auto}
  .buttons{align-items:stretch;flex-direction:column}
  .buttons>*{width:100%}
  .app-grid{grid-template-columns:1fr}
}