/* ============================================================
   SIGN IN (login.php) — K3 palette, split layout.
   Buttons use `.k3-scope .k3-auth button.x` to beat the theme's
   `.k3-scope button:not(.btn)` reset (it strips backgrounds).
============================================================ */
.k3-auth{position:relative;min-height:100vh;display:flex;align-items:center;
  padding:clamp(96px,14vh,140px) clamp(16px,5vw,72px) clamp(40px,8vh,80px)}
.k3-auth-wrap{position:relative;z-index:2;width:100%;max-width:1160px;margin:0 auto;
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,460px);gap:clamp(32px,6vw,96px);align-items:center}

/* ---------- left: welcome ---------- */
.k3-auth-side{color:var(--k3-cream)}
.k3-auth-h{margin:18px 0 0;font-family:var(--k3-display);font-weight:400;text-transform:uppercase;line-height:.92;
  font-size:clamp(3.2rem,8vw,6.6rem);letter-spacing:.005em;color:var(--k3-cream)}
.k3-auth-roles{display:flex;flex-direction:column;gap:12px;margin:36px 0 0;padding:0;list-style:none;max-width:520px}
.k3-auth-roles li{display:flex;align-items:flex-start;gap:16px;padding:16px 18px;border-radius:18px;
  background:rgba(241,239,228,.05);border:1px solid rgba(241,239,228,.1);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.k3-auth-ic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;background:rgba(142,188,13,.16);color:var(--k3-lime2);font-size:1rem}
.k3-auth-roles b{display:block;font-size:.98rem;color:var(--k3-cream)}
.k3-auth-roles span{font-size:.875rem;line-height:1.5;color:rgba(241,239,228,.66)}
.k3-auth-fans{display:flex;align-items:flex-start;gap:10px;max-width:520px;margin:24px 0 0;font-size:.875rem;line-height:1.55;color:rgba(241,239,228,.66)}
.k3-auth-fans i{margin-top:3px;color:var(--k3-lime2)}
.k3-scope .k3-auth-fans a{color:var(--k3-lime2);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.k3-scope .k3-auth-fans a:hover{color:var(--k3-cream)}

/* ---------- right: card ---------- */
.k3-auth-card{position:relative;padding:clamp(28px,4vw,40px);border-radius:28px;background:#FBFBF7;color:var(--k3-ink);
  box-shadow:0 40px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06);animation:k3-auth-in .5s cubic-bezier(.25,.1,.25,1) both}
.k3-auth-card::before{content:"";position:absolute;inset:0 0 auto;height:5px;border-radius:28px 28px 0 0;background:linear-gradient(90deg,var(--k3-ink3),var(--k3-lime),var(--k3-lime2))}
@keyframes k3-auth-in{from{opacity:0;transform:translateY(16px)}}
.k3-auth-logo{display:block;width:56px;height:56px;padding:8px;border-radius:16px;background:var(--k3-ink);object-fit:contain}
.k3-auth-card h2{margin:18px 0 0;font-family:var(--k3-display);font-weight:400;font-size:2.4rem;line-height:1;text-transform:uppercase;letter-spacing:.01em;color:var(--k3-ink)}
.k3-auth-sub{margin:8px 0 0;font-size:.9375rem;line-height:1.5;color:rgba(11,32,24,.62)}
.k3-auth-alert{display:flex;align-items:flex-start;gap:10px;margin:20px 0 0;padding:12px 14px;border-radius:14px;
  background:#FEF2F2;border:1px solid #FECACA;color:#991B1B;font-size:.875rem;font-weight:500;animation:k3-auth-shake .35s}
.k3-auth-alert i{margin-top:2px}
form#loginForm{margin-top:24px}
.k3-auth-field{margin-bottom:18px}
.k3-auth-field label{display:block;margin-bottom:8px;font-size:.8125rem;font-weight:700;color:#2A3A31}
.k3-auth-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.k3-scope .k3-auth .k3-auth-link{font-size:.8125rem;font-weight:700;color:#4D7A00;text-decoration:none}
.k3-scope .k3-auth .k3-auth-link:hover{color:var(--k3-ink);text-decoration:underline;text-underline-offset:3px}
.k3-auth-link:focus-visible,.k3-auth-fans a:focus-visible{outline:2px solid var(--k3-lime);outline-offset:2px;border-radius:4px}
.k3-auth-input{position:relative}
.k3-auth-input>i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#9AA59D;font-size:.95rem;pointer-events:none;transition:color .15s}
.k3-auth-input input{width:100%;height:54px;padding:0 52px 0 46px;border:1.5px solid #DCE1D6;border-radius:14px;background:#fff;
  font:500 1rem/1 var(--k3-sans);color:var(--k3-ink);transition:border-color .15s,box-shadow .15s}
.k3-auth-input input::placeholder{color:#A3ACA5}
.k3-auth-input input:hover{border-color:#C3CBBC}
.k3-auth-input input:focus{outline:none;border-color:var(--k3-ink3);box-shadow:0 0 0 4px rgba(142,188,13,.25)}
.k3-auth-input:focus-within>i{color:var(--k3-ink3)}
.k3-auth-input input[aria-invalid="true"]{border-color:#E5484D;box-shadow:0 0 0 4px rgba(229,72,77,.12)}
.k3-auth-input.is-shake{animation:k3-auth-shake .35s}
@keyframes k3-auth-shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.k3-scope .k3-auth button.k3-auth-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:40px;height:40px;
  border:0;border-radius:10px;background:transparent;color:#7C8780;cursor:pointer;transition:background .15s,color .15s}
.k3-scope .k3-auth button.k3-auth-eye:hover{background:#F1F3EE;color:var(--k3-ink)}
.k3-scope .k3-auth button.k3-auth-eye:focus-visible{outline:2px solid var(--k3-lime);outline-offset:0}
.k3-auth-caps{display:flex;align-items:center;gap:6px;margin:8px 0 0;font-size:.8125rem;font-weight:600;color:#B54708}
.k3-auth-caps[hidden]{display:none}

.k3-scope .k3-auth button.k3-auth-submit{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:56px;margin-top:8px;
  border:0;border-radius:16px;background:var(--k3-ink);color:var(--k3-cream);font:700 1rem/1 var(--k3-sans);cursor:pointer;overflow:hidden;
  transition:transform .15s,box-shadow .2s,background .2s}
.k3-scope .k3-auth button.k3-auth-submit::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(182,230,69,.22) 50%,transparent 70%);
  transform:translateX(-100%);transition:transform .6s}
.k3-scope .k3-auth button.k3-auth-submit:hover{background:var(--k3-ink3);box-shadow:0 14px 30px rgba(11,32,24,.3);transform:translateY(-2px)}
.k3-scope .k3-auth button.k3-auth-submit:hover::after{transform:translateX(100%)}
.k3-scope .k3-auth button.k3-auth-submit:active{transform:scale(.98)}
.k3-scope .k3-auth button.k3-auth-submit:focus-visible{outline:none;box-shadow:0 0 0 3px #FBFBF7,0 0 0 6px var(--k3-lime)}
.k3-auth-submit i{color:var(--k3-lime2);transition:transform .2s}
.k3-auth-submit:hover i{transform:translateX(4px)}
.k3-auth-spin{display:none;width:18px;height:18px;border-radius:50%;border:2px solid rgba(241,239,228,.35);border-top-color:var(--k3-lime2);animation:k3-auth-spin .7s linear infinite}
@keyframes k3-auth-spin{to{transform:rotate(360deg)}}
.k3-scope .k3-auth button.k3-auth-submit.is-busy{cursor:progress;opacity:.92}
.k3-auth-submit.is-busy i{display:none}
.k3-auth-submit.is-busy .k3-auth-spin{display:block}

.k3-auth-or{display:flex;align-items:center;gap:12px;margin:28px 0 16px;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#9AA59D}
.k3-auth-or::before,.k3-auth-or::after{content:"";flex:1;height:1px;background:#E3E6DE}
.k3-auth-alt{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.k3-auth-alt-btn{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;border:1.5px solid #E3E6DE;background:#fff;color:var(--k3-ink);
  text-decoration:none;transition:border-color .15s,transform .15s,box-shadow .15s}
.k3-auth-alt-btn:hover{border-color:var(--k3-lime);transform:translateY(-2px);box-shadow:0 10px 20px rgba(11,32,24,.08);color:var(--k3-ink)}
.k3-auth-alt-btn:focus-visible{outline:2px solid var(--k3-lime);outline-offset:2px}
.k3-auth-alt-btn i{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:10px;background:#EEF6D6;color:#4D7A00}
.k3-auth-alt-btn span{display:flex;flex-direction:column;min-width:0}
.k3-auth-alt-btn b{font-size:.875rem}
.k3-auth-alt-btn small{font-size:.72rem;line-height:1.35;color:rgba(11,32,24,.55)}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .k3-auth{align-items:flex-start;padding-top:96px}
  .k3-auth-wrap{grid-template-columns:1fr;max-width:520px;gap:28px}
  .k3-auth-h{font-size:clamp(2.6rem,12vw,3.6rem)}
  .k3-auth-roles{display:none}
  .k3-auth-fans{order:3;margin-top:4px}
  .k3-auth-side{display:flex;flex-direction:column}
}
@media (max-width:480px){
  .k3-auth{padding:88px 16px 32px}
  .k3-auth-card{padding:24px 20px;border-radius:24px}
  .k3-auth-card::before{border-radius:24px 24px 0 0}
  .k3-auth-card h2{font-size:2rem}
  .k3-auth-alt{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.k3-auth *{animation:none!important;transition:none!important}}