:root{
  /* SUPRETEK PREMIUM VISUAL PHASE B R1 — LIGHT */
  --app-bg:140 15.789% 96.275%;              /* #F4F7F5 */
  --surface-primary:0 0% 100%;               /* #FFFFFF */
  --surface-secondary:120 20% 98.039%;        /* #F9FBF9 */
  --border-default:140 15.254% 88.431%;       /* #DDE6E0 */
  --text-primary:150 28% 9.804%;              /* #122019 */
  --text-muted:144 6.726% 43.725%;            /* #68776E */
  --brand-primary:156.667 80.357% 21.961%;    /* #0B6542 */
  --brand-strong:157.183 81.609% 17.059%;     /* #084F34 */
  --brand-soft:141.818 31.429% 93.137%;       /* #E8F3EC */

  --background:var(--app-bg);
  --foreground:var(--text-primary);
  --surface:var(--surface-secondary);
  --surface-elevated:var(--surface-primary);
  --card:var(--surface-primary);
  --card-foreground:var(--text-primary);
  --popover:var(--surface-primary);
  --popover-foreground:var(--text-primary);
  --muted:var(--surface-secondary);
  --muted-foreground:var(--text-muted);
  --border:var(--border-default);
  --input:var(--border-default);

  --primary:var(--brand-primary);
  --primary-foreground:0 0% 100%;
  --primary-glow:152.061 65.829% 39.020%;
  --secondary:141.818 31.429% 93.137%;
  --secondary-foreground:150 28% 9.804%;
  --brand-lime:156.667 80.357% 21.961%;
  --brand-lime-foreground:0 0% 100%;
  --accent:var(--brand-soft);
  --accent-foreground:156.667 80.357% 21.961%;
  --ring:156.667 80.357% 21.961%;
  --steel:156.667 80.357% 21.961%;
  --steel-foreground:0 0% 100%;

  --sidebar-background:120 20% 98.039%;
  --sidebar-foreground:144 6.726% 43.725%;
  --sidebar-primary:156.667 80.357% 21.961%;
  --sidebar-primary-foreground:0 0% 100%;
  --sidebar-accent:141.818 31.429% 93.137%;
  --sidebar-accent-foreground:150 28% 9.804%;
  --sidebar-border:140 15.254% 88.431%;
  --sidebar-ring:156.667 80.357% 21.961%;
}
.dark{
  /* SUPRETEK PREMIUM VISUAL PHASE B R1 — DARK */
  --app-bg:144 20% 4.902%;                   /* #0A0F0C */
  --surface-primary:145.714 17.073% 8.039%;  /* #111814 */
  --surface-secondary:140 17.647% 10%;       /* #151E18 */
  --border-default:145.714 16.667% 16.471%;  /* #233129 */
  --text-primary:135 18.182% 95.686%;         /* #F2F6F3 */
  --text-muted:144 7.317% 59.804%;            /* #91A097 */
  --brand-primary:156.667 80.357% 21.961%;    /* #0B6542 */
  --brand-active:152.061 65.829% 39.020%;     /* #22A568 */
  --brand-soft:147 34.483% 11.373%;           /* #13271C */

  --background:var(--app-bg);
  --foreground:var(--text-primary);
  --surface:var(--surface-secondary);
  --surface-elevated:var(--surface-primary);
  --card:var(--surface-primary);
  --card-foreground:var(--text-primary);
  --popover:var(--surface-primary);
  --popover-foreground:var(--text-primary);
  --muted:var(--surface-secondary);
  --muted-foreground:var(--text-muted);
  --border:var(--border-default);
  --input:var(--border-default);

  --primary:var(--brand-primary);
  --primary-foreground:0 0% 100%;
  --primary-glow:var(--brand-active);
  --secondary:147 34.483% 11.373%;
  --secondary-foreground:135 18.182% 95.686%;
  --brand-lime:152.061 65.829% 39.020%;
  --brand-lime-foreground:144 20% 4.902%;
  --accent:var(--brand-soft);
  --accent-foreground:135 18.182% 95.686%;
  --ring:var(--brand-active);
  --steel:var(--brand-active);
  --steel-foreground:144 20% 4.902%;

  --sidebar-background:145.714 17.073% 8.039%;
  --sidebar-foreground:144 7.317% 59.804%;
  --sidebar-primary:152.061 65.829% 39.020%;
  --sidebar-primary-foreground:144 20% 4.902%;
  --sidebar-accent:147 34.483% 11.373%;
  --sidebar-accent-foreground:135 18.182% 95.686%;
  --sidebar-border:145.714 16.667% 16.471%;
  --sidebar-ring:152.061 65.829% 39.020%;
}

/* Login is brand-forward; native CRM modules continue to consume the semantic tokens above. */
.supretek-login-shell{
  min-height:100dvh;
  background:hsl(var(--background));
  color:hsl(var(--foreground));
}
.supretek-login-grid{
  min-height:100dvh;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
}
.supretek-login-story{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  min-height:100dvh;
  padding:clamp(2.5rem,5vw,5.5rem);
  color:#F2F6F3;
  background:
    radial-gradient(circle at 18% 18%,rgba(34,165,104,.20),transparent 30%),
    radial-gradient(circle at 82% 68%,rgba(11,101,66,.24),transparent 36%),
    linear-gradient(145deg,#063C29 0%,#0B2418 38%,#0A0F0C 100%);
}
.supretek-login-story::before,
.supretek-login-story::after{
  content:"";
  position:absolute;
  pointer-events:none;
  opacity:.22;
}
.supretek-login-story::before{
  inset:-16% -24% 25% 16%;
  border:1px solid rgba(99,201,142,.38);
  transform:rotate(-13deg) skewX(-9deg);
  border-radius:34% 12% 30% 18%;
}
.supretek-login-story::after{
  width:62%;
  height:34%;
  right:-14%;
  bottom:9%;
  border-top:1px solid rgba(99,201,142,.42);
  border-bottom:1px solid rgba(99,201,142,.18);
  transform:rotate(-13deg) skewX(-18deg);
}
.supretek-login-story-inner{
  position:relative;
  z-index:2;
  width:min(720px,100%);
}
.supretek-brand-lockup{
  display:flex;
  align-items:center;
  gap:.9rem;
}
.supretek-brand-mark{
  width:52px;
  height:52px;
  display:block;
  flex:0 0 auto;
}
.supretek-brand-word{
  font-size:1.22rem;
  font-weight:700;
  letter-spacing:-.02em;
}
.supretek-brand-suite{
  margin-top:.15rem;
  font-size:.66rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#91A097;
}
.supretek-login-kicker{
  margin-top:clamp(4.5rem,12vh,8rem);
  color:#63C98E;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.supretek-login-headline{
  margin-top:1rem;
  max-width:680px;
  font-size:clamp(2.6rem,5.2vw,5.7rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:760;
}
.supretek-login-copy{
  margin-top:1.45rem;
  max-width:620px;
  color:#C9D4CD;
  font-size:clamp(1rem,1.35vw,1.22rem);
  line-height:1.75;
}
.supretek-login-pill-row{
  margin-top:2rem;
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}
.supretek-login-pill{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:.45rem .75rem;
  border:1px solid rgba(145,160,151,.23);
  border-radius:999px;
  background:rgba(17,24,20,.52);
  color:#DCE5DF;
  font-size:.76rem;
  backdrop-filter:blur(10px);
}
.supretek-login-auth{
  position:relative;
  display:grid;
  place-items:center;
  min-height:100dvh;
  padding:clamp(1.5rem,4vw,4.5rem);
  background:hsl(var(--background));
}
.supretek-login-auth::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 82% 12%,hsl(var(--accent)/.55),transparent 28%);
  opacity:.8;
}
.supretek-login-card{
  position:relative;
  z-index:2;
  width:min(460px,100%);
}
.supretek-login-mobile-brand{
  display:none;
}
.supretek-login-eyebrow{
  color:hsl(var(--primary));
  font-size:.72rem;
  font-weight:750;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.supretek-login-title{
  margin-top:.65rem;
  font-size:2.25rem;
  line-height:1.08;
  font-weight:720;
  letter-spacing:-.04em;
}
.supretek-login-subtitle{
  margin-top:.7rem;
  color:hsl(var(--muted-foreground));
  line-height:1.65;
  font-size:.92rem;
}
.supretek-login-form{
  margin-top:2rem;
  padding:1.4rem;
  border:1px solid hsl(var(--border));
  border-radius:1.15rem;
  background:hsl(var(--card)/.96);
  box-shadow:0 26px 70px rgba(3,12,7,.10);
}
.dark .supretek-login-form{
  box-shadow:0 30px 78px rgba(0,0,0,.34);
}
.supretek-login-field{
  display:flex;
  flex-direction:column;
  gap:.45rem;
}
.supretek-login-field + .supretek-login-field{
  margin-top:1.05rem;
}
.supretek-login-label{
  font-size:.82rem;
  font-weight:650;
}
.supretek-login-input{
  width:100%;
  height:44px;
  border:1px solid hsl(var(--input));
  border-radius:.72rem;
  padding:0 .85rem;
  background:hsl(var(--background));
  color:hsl(var(--foreground));
  outline:none;
  transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.supretek-login-input:focus{
  border-color:hsl(var(--ring));
  box-shadow:0 0 0 3px hsl(var(--ring)/.14);
}
.supretek-password-wrap{
  position:relative;
}
.supretek-password-wrap .supretek-login-input{
  padding-right:4.2rem;
}
.supretek-password-toggle{
  position:absolute;
  top:50%;
  right:.78rem;
  transform:translateY(-50%);
  color:hsl(var(--muted-foreground));
  font-size:.74rem;
}
.supretek-login-meta{
  margin-top:.8rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  font-size:.76rem;
  color:hsl(var(--muted-foreground));
}
.supretek-login-check{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.supretek-login-link{
  color:hsl(var(--primary));
  font-weight:650;
}
.supretek-login-message{
  margin-top:1rem;
  border:1px solid hsl(var(--border));
  border-radius:.72rem;
  padding:.72rem .82rem;
  font-size:.82rem;
}
.supretek-login-message.error{
  border-color:hsl(var(--destructive)/.48);
  color:hsl(var(--destructive));
  background:hsl(var(--destructive)/.06);
}
.supretek-login-submit{
  margin-top:1.15rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:44px;
  border-radius:.72rem;
  background:hsl(var(--primary));
  color:hsl(var(--primary-foreground));
  font-size:.84rem;
  font-weight:720;
  letter-spacing:.02em;
  box-shadow:0 12px 30px hsl(var(--primary)/.18);
  transition:transform .15s ease,background-color .15s ease,box-shadow .15s ease;
}
.supretek-login-submit:hover{
  background:hsl(var(--brand-strong));
  box-shadow:0 16px 34px hsl(var(--primary)/.24);
  transform:translateY(-1px);
}
.dark .supretek-login-submit:hover{
  background:hsl(var(--brand-active));
  color:#07110B;
}
.supretek-login-helper{
  margin-top:1rem;
  text-align:center;
  color:hsl(var(--muted-foreground));
  font-size:.75rem;
}
.supretek-login-theme-toggle{
  position:absolute;
  top:1.25rem;
  right:1.25rem;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  min-height:34px;
  padding:.42rem .7rem;
  border:1px solid hsl(var(--border));
  border-radius:999px;
  background:hsl(var(--card)/.82);
  color:hsl(var(--muted-foreground));
  font-size:.73rem;
  backdrop-filter:blur(10px);
}
.supretek-login-theme-toggle:hover{
  color:hsl(var(--foreground));
}
.supretek-login-footer{
  margin-top:1.25rem;
  text-align:center;
  color:hsl(var(--muted-foreground));
  font-size:.7rem;
}
@media (prefers-reduced-motion:no-preference){
  .supretek-brand-lockup,
  .supretek-login-kicker,
  .supretek-login-headline,
  .supretek-login-copy,
  .supretek-login-form{
    animation:supretek-login-enter .55s ease both;
  }
  .supretek-login-kicker{animation-delay:.06s}
  .supretek-login-headline{animation-delay:.11s}
  .supretek-login-copy{animation-delay:.16s}
  .supretek-login-form{animation-delay:.12s}
  @keyframes supretek-login-enter{
    from{opacity:0;transform:translateY(8px)}
    to{opacity:1;transform:translateY(0)}
  }
}
@media (max-width:920px){
  .supretek-login-grid{
    grid-template-columns:1fr;
  }
  .supretek-login-story{
    display:none;
  }
  .supretek-login-auth{
    min-height:100dvh;
    padding:5.5rem 1.2rem 2.4rem;
  }
  .supretek-login-mobile-brand{
    display:block;
    margin-bottom:2rem;
  }
  .supretek-login-mobile-brand .supretek-brand-lockup{
    margin-bottom:1.2rem;
  }
  .supretek-login-mobile-headline{
    font-size:2rem;
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:740;
  }
  .supretek-login-mobile-copy{
    margin-top:.75rem;
    color:hsl(var(--muted-foreground));
    font-size:.88rem;
    line-height:1.6;
  }
}
@media (max-width:520px){
  .supretek-login-auth{
    place-items:start stretch;
  }
  .supretek-login-form{
    padding:1.1rem;
    border-radius:1rem;
  }
  .supretek-login-title{
    font-size:1.85rem;
  }
  .supretek-login-meta{
    align-items:flex-start;
    flex-direction:column;
    gap:.65rem;
  }
}
/* SUPRETEK LOCATION / WORK SESSION C1-R1 */
.supretek-work-session-stage{
  width:100%;
}
.supretek-work-session-card{
  margin-top:2rem;
  padding:1.4rem;
  border:1px solid hsl(var(--border));
  border-radius:1.15rem;
  background:hsl(var(--card)/.96);
  box-shadow:0 26px 70px rgba(3,12,7,.10);
}
.dark .supretek-work-session-card{
  box-shadow:0 30px 78px rgba(0,0,0,.34);
}
.supretek-work-session-user{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  padding-bottom:1rem;
  border-bottom:1px solid hsl(var(--border));
}
.supretek-work-session-role{
  font-size:.88rem;
  font-weight:720;
  color:hsl(var(--foreground));
}
.supretek-work-session-email{
  margin-top:.2rem;
  font-size:.76rem;
  color:hsl(var(--muted-foreground));
}
.supretek-work-session-time{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  font-variant-numeric:tabular-nums;
}
.supretek-work-session-time-label{
  font-size:.64rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:hsl(var(--muted-foreground));
}
.supretek-work-session-time strong{
  margin-top:.2rem;
  font-size:.92rem;
  color:hsl(var(--foreground));
}
.supretek-work-session-branch-field{
  margin-top:1.2rem;
}
.supretek-work-session-note{
  margin-top:.25rem;
  color:hsl(var(--muted-foreground));
  font-size:.72rem;
}
.supretek-work-session-location-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.7rem;
  margin-top:1rem;
}
.supretek-work-session-location{
  min-width:0;
  padding:.78rem .85rem;
  border:1px solid hsl(var(--border));
  border-radius:.78rem;
  background:hsl(var(--background));
}
.supretek-work-session-location-wide{
  grid-column:1/-1;
}
.supretek-work-session-location span{
  display:block;
  font-size:.64rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:hsl(var(--muted-foreground));
}
.supretek-work-session-location strong{
  display:block;
  margin-top:.3rem;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.82rem;
  font-weight:680;
  color:hsl(var(--foreground));
}
.supretek-work-session-status{
  margin-top:1rem;
  padding:.75rem .82rem;
  border:1px solid hsl(var(--border));
  border-radius:.72rem;
  background:hsl(var(--accent)/.52);
  color:hsl(var(--muted-foreground));
  font-size:.76rem;
  line-height:1.55;
}
.supretek-work-session-status.active{
  border-color:hsl(var(--primary)/.32);
  color:hsl(var(--foreground));
  background:hsl(var(--primary)/.08);
}
.supretek-work-session-status.error{
  border-color:hsl(var(--destructive)/.48);
  color:hsl(var(--destructive));
  background:hsl(var(--destructive)/.06);
}
.supretek-work-session-switch{
  display:block;
  width:100%;
  margin-top:.85rem;
  text-align:center;
  color:hsl(var(--muted-foreground));
  font-size:.74rem;
  font-weight:620;
}
.supretek-work-session-switch:hover{
  color:hsl(var(--foreground));
}
@media (max-width:520px){
  .supretek-work-session-card{
    padding:1.1rem;
    border-radius:1rem;
  }
  .supretek-work-session-user{
    flex-direction:column;
  }
  .supretek-work-session-time{
    align-items:flex-start;
  }
  .supretek-work-session-location-grid{
    grid-template-columns:1fr;
  }
  .supretek-work-session-location-wide{
    grid-column:auto;
  }
}
