/* Auth pages: the landing "Sticker Sheet" theme, layered over app.css. */
.auth-shell{
  --orange:#F26A1B; --orange-ink:#B8420E; --peach:#FFE9DA; --peach-2:#FFD9BF;
  --cream:#FFF4EA; --cream-line:#FBDCC3; --visor:#17140F;
  --ink:#17140F; --ink-dim:#4A4540; --ink-faint:#6B645D;
  --gold:var(--orange); --gold-dim:var(--orange-ink);
  --lift:0 14px 24px -12px rgba(23,20,15,0.38), 0 2px 4px rgba(23,20,15,0.08);
  --ff-display:'M PLUS Rounded 1c', 'Figtree', ui-rounded, system-ui, sans-serif;
  --ff-body:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background:var(--white, #fff);
  font-family:var(--ff-body); color:var(--ink);
}
.auth-shell ::selection{ background:var(--orange); color:#fff; }
.auth-shell :focus-visible{ outline:3px solid var(--visor); outline-offset:3px; }

/* form panel */
.auth-shell .auth-main{ font-family:var(--ff-body); font-size:16px; background:#fff; }
.auth-shell .auth-main h1, .auth-shell .auth-main h2, .auth-shell .auth-main h3{ font-family:var(--ff-display); font-weight:800; letter-spacing:-0.02em; }
.auth-shell .auth-main .card-title{ font-size:30px; line-height:1.1; color:var(--ink); }
.auth-shell .auth-main .muted{ font-size:15.5px; color:var(--ink-dim); }
.auth-shell .auth-main label.field{ font-size:14.5px; font-weight:700; color:var(--ink); margin-bottom:7px; letter-spacing:0; }
.auth-shell .auth-main .field-wrap{ margin-bottom:18px; }
.auth-shell .auth-main input[type="text"], .auth-shell .auth-main input[type="email"], .auth-shell .auth-main input[type="password"],
.auth-shell .auth-main input[type="url"], .auth-shell .auth-main input[type="tel"], .auth-shell .auth-main select, .auth-shell .auth-main textarea{
  font-family:var(--ff-body); font-size:16px; padding:13px 16px; border-radius:16px;
  border:2px solid var(--peach-2); background:#fff; color:var(--ink);
}
.auth-shell .auth-main input:hover{ border-color:#FFC49B; }
.auth-shell .auth-main input:focus, .auth-shell .auth-main select:focus, .auth-shell .auth-main textarea:focus{
  outline:none; border-color:var(--orange); box-shadow:0 0 0 4px rgba(242,106,27,0.18);
}
.auth-shell .auth-main input.invalid{ border-color:#C23B32; }
.auth-shell .auth-main .pass-wrap input{ padding-right:48px; }
.auth-shell .pass-toggle{ right:8px; border-radius:50%; color:var(--ink-faint); }
.auth-shell .pass-toggle:hover{ background:var(--cream); color:var(--orange-ink); }
.auth-shell .auth-main .err{ font-size:13.5px; color:#C23B32; margin-top:6px; }
.auth-shell input[type="checkbox"]{ accent-color:var(--orange); width:18px; height:18px; }
.auth-shell .auth-main label.flex{ font-size:15px; font-weight:500; gap:9px; }
.auth-shell .strength-label{ font-size:12.5px; }

.auth-shell .auth-main .btn{
  font-family:var(--ff-display); font-size:16.5px; font-weight:800;
  padding:14px 22px; border-radius:999px; border:none;
  transition:transform .35s cubic-bezier(0.22,1,0.36,1), box-shadow .3s ease, background .2s ease;
}
.auth-shell .auth-main .btn:hover{ transform:translateY(-2px); }
.auth-shell .auth-main .btn:active{ transform:scale(0.98); }
.auth-shell .auth-main .btn.primary{ background:var(--orange); color:#fff; box-shadow:0 0 0 3px #fff, var(--lift); }
.auth-shell .auth-main .btn.primary:hover{ background:#E35C10; color:#fff; }
.auth-shell .auth-main .btn:not(.primary){ background:#fff; color:var(--ink); box-shadow:inset 0 0 0 2px var(--cream-line); }
.auth-shell .auth-main .btn:not(.primary):hover{ background:var(--cream); box-shadow:inset 0 0 0 2px var(--orange); color:var(--ink); }
.auth-shell .auth-main .link{ font-size:15px; font-weight:700; color:var(--orange-ink); text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:3px; }
.auth-shell .auth-main .link:hover{ color:var(--ink); }
.auth-shell .auth-divider{ font-family:var(--ff-body); font-size:13px; font-weight:700; color:var(--ink-faint); }
.auth-shell .auth-divider::before, .auth-shell .auth-divider::after{ background:var(--cream-line); height:2px; border-radius:2px; }
.auth-shell .alert{ border-radius:16px; }
.auth-shell .auth-main .auth-foot{ font-size:15px; }
.auth-shell .auth-back{ display:inline-flex; align-items:center; gap:7px; color:var(--orange-ink); font-weight:700; }
.auth-shell .auth-back:hover{ color:var(--ink); }

/* mobile brand strip (brand panel hidden below 900px) */
.auth-mobile-head{ display:flex; align-items:center; gap:10px; margin-bottom:28px; font-family:var(--ff-display); font-weight:800; font-size:22px; color:var(--ink); }

.auth-logo{ display:block; height:34px; width:auto; }
@media (min-width:900px){ .auth-shell .auth-brand-head .auth-logo{ height:40px; } }

/* logo sticker */
.auth-shell .logo-mark{
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  background:#fff; color:var(--orange); font-size:18px;
  box-shadow:0 0 0 3px #fff, var(--lift); transform:rotate(-6deg);
}
.auth-shell .logo-mark img{ width:100%; height:100%; object-fit:contain; }

@media (min-width:900px){
  .auth-mobile-head{ display:none; }
  .auth-shell .auth-main{ background:#fff; }
  .auth-shell .auth-brand{
    background:var(--cream); color:var(--ink);
    border-right:2px solid var(--cream-line);
  }
  .auth-shell .auth-brand::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background-image:radial-gradient(rgba(242,106,27,0.16) 1.4px, transparent 1.6px);
    background-size:26px 26px;
    -webkit-mask-image:linear-gradient(180deg, #000 0%, transparent 85%);
            mask-image:linear-gradient(180deg, #000 0%, transparent 85%);
  }
  .auth-shell .auth-brand-head{ font-family:var(--ff-display); font-weight:800; font-size:24px; letter-spacing:-0.02em; color:var(--ink); }
  .auth-shell .auth-brand-title{ font-family:var(--ff-display); font-weight:800; font-size:clamp(34px,3.4vw,52px); line-height:1.04; letter-spacing:-0.03em; color:var(--ink); }
  .auth-shell .auth-brand-title .grad{ background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--orange-ink); }
  .auth-shell .auth-brand-sub{ font-family:var(--ff-body); font-size:17.5px; line-height:1.55; color:var(--ink-dim); }
  .auth-shell .auth-pill{
    font-family:var(--ff-display); font-weight:800; font-size:13.5px; letter-spacing:0;
    border:none; background:#fff; color:var(--ink); padding:7px 14px; box-shadow:var(--lift); transform:rotate(-2deg);
  }
  .auth-shell .auth-pulse{ background:#0F7A5A; animation:none; }
  .auth-shell .auth-brand-feats li{ font-family:var(--ff-body); font-size:16px; font-weight:600; color:var(--ink); align-items:center; }
  .auth-shell .auth-tick{ width:26px; height:26px; border-radius:50%; background:var(--orange); color:#fff; font-size:12px; box-shadow:0 0 0 3px #fff; }
  .auth-robot{
    position:absolute; right:clamp(16px,4vw,56px); bottom:clamp(16px,4vh,48px); width:clamp(120px,11vw,170px); height:auto; z-index:1;
    filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 16px 18px rgba(184,66,14,0.25));
    transform:rotate(4deg); pointer-events:none; user-select:none;
  }
}
@media (max-width:899px){
  .auth-robot{ display:none; }
}
