/* Owner and staff sign-in */
.login-page-shell{min-height:100dvh;background:radial-gradient(circle at 8% 9%,#f7faf4,transparent 30%),radial-gradient(circle at 95% 90%,#d6e8d9,transparent 34%),#e9f0e9}
.login-layout{border-color:#cfdfd2;border-radius:28px;box-shadow:0 32px 85px rgba(17,56,38,.16)}
.login-story{background:linear-gradient(155deg,#102d33,#124338 66%,#29664a)}
.login-story:after{content:"";position:absolute;z-index:-1;inset:0 0 0 35%;background:linear-gradient(rgba(211,239,219,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(211,239,219,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.7));pointer-events:none}
.login-story:before{background:radial-gradient(circle,#4b9672,transparent 65%)}
.login-edition{padding:7px 11px;border:1px solid rgba(217,235,157,.35);border-radius:99px;background:rgba(217,235,157,.09);color:#e1f1ac}
.login-story h1{font-size:clamp(39px,3.65vw,52px);font-weight:690;letter-spacing:-.067em;line-height:1.06}
.login-story-features{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.login-story-features span{display:inline-flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid rgba(211,238,218,.18);border-radius:9px;background:rgba(235,255,238,.06);color:#e6f4e8;font-size:11px;font-weight:650;white-space:nowrap}
.login-story-features b{color:#d5eea1;font-size:9px;letter-spacing:.08em}
.login-orbit-one{border-color:rgba(223,249,226,.27)}
.login-orbit-two{border-color:rgba(223,249,226,.22);box-shadow:inset 0 0 0 30px rgba(225,246,225,.018)}
.login-orbit-two:before,.login-orbit-two:after{content:"";position:absolute;left:50%;top:50%;background:rgba(214,243,222,.17);transform:translate(-50%,-50%)}
.login-orbit-two:before{width:1px;height:100%}.login-orbit-two:after{width:100%;height:1px}
.login-panel{background:linear-gradient(145deg,#fff,#f9fcf8)}
.login-panel h2{font-size:clamp(30px,3vw,39px)}
.login-account-switch{border-color:#dce9dc;background:#eff5ee;border-radius:14px}
.login-account-switch button{border-radius:10px;cursor:pointer}
.login-account-switch button.active{background:#1d644d;color:#fff;box-shadow:0 6px 14px rgba(20,93,65,.18)}
.login-account-switch button.active:hover{color:#fff}
.login-field input{border-radius:12px}
.login-pin-field{margin-bottom:5px}
.login-pin-wrap{display:flex;align-items:center;gap:10px}
.login-pin-wrap .login-pin-digits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;flex:1;min-width:0}
.login-pin-wrap .pin-digit{width:100%;height:62px;min-width:0;padding:0;border:1px solid #cadfd0;border-radius:14px;background:#f8fbf6;color:#174a3e;text-align:center;font-size:28px;font-weight:750;line-height:1;box-shadow:inset 0 -3px 0 #e6f0e5}
.login-pin-wrap .pin-digit:valid{border-color:#8cbe96;background:#f4faf0}
.login-pin-wrap .pin-digit:focus{border-color:#388a69;background:#fff;box-shadow:0 0 0 4px rgba(63,148,106,.13),inset 0 -3px 0 #7bb897}
.login-pin-field.complete .pin-digit{border-color:#70ab7e;background:#edf8e9;box-shadow:inset 0 -3px 0 #9cd29b}
.login-pin-field.verifying .pin-digit{border-color:#62a87d;border-radius:50%;background:#e6f6e8;animation:pin-circle 850ms ease-in-out infinite;box-shadow:0 0 0 3px rgba(77,157,106,.09)}
.login-pin-field.verifying .pin-digit:nth-child(2){animation-delay:100ms}.login-pin-field.verifying .pin-digit:nth-child(3){animation-delay:200ms}.login-pin-field.verifying .pin-digit:nth-child(4){animation-delay:300ms}
.login-pin-field.verified .pin-digit{border-color:#378b5b;border-radius:50%;background:#dff3e3;box-shadow:0 0 0 4px rgba(56,148,85,.13)}
.login-pin-wrap #pin{display:none!important}
.pin-hint{display:block;margin-top:9px;color:#829b89;font-size:10px;font-weight:500;letter-spacing:.01em}
.login-submit{margin-top:24px;border-radius:13px;background:#195f49;cursor:pointer}
.login-submit:disabled{cursor:wait;opacity:1}
.login-submit.is-loading{background:#194c40}
.login-submit.is-loading .login-arrow{position:relative;font-size:0}
.login-submit.is-loading .login-arrow:after{content:"";display:block;width:21px;height:21px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:pin-spin .7s linear infinite}
.login-submit.is-success{background:#2f8257}
.login-submit.is-success .login-arrow{font-size:0}
.login-submit.is-success .login-arrow:after{content:"✓";font-size:22px;font-weight:750}
.login-success{display:flex;align-items:center;gap:11px;margin:0 0 18px;padding:12px 14px;border:1px solid #bde2c4;border-radius:12px;background:#ecf8eb;color:#225b3e}
.login-success>span{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:50%;background:#358a59;color:#fff;font-size:20px}
.login-success strong,.login-success small{display:block}.login-success strong{font-size:12px}.login-success small{color:#5b8468;font-size:10px}
.staff-mode .login-story{background:linear-gradient(155deg,#142f3a,#174956 64%,#28716b)}
.staff-mode .login-edition{border-color:rgba(171,226,223,.36);background:rgba(171,226,223,.1);color:#c6f0e3}
.staff-mode .login-account-switch button.active{background:#1e6773}
@keyframes pin-spin{to{transform:rotate(360deg)}}
@keyframes pin-circle{0%,100%{transform:scale(.91);box-shadow:0 0 0 2px rgba(78,159,111,.08)}50%{transform:scale(1.04);box-shadow:0 0 0 7px rgba(78,159,111,.14)}}
@media(max-width:760px){
  html,body{background:#fff;min-height:100%}
  .login-page-shell{min-height:100dvh;padding:0;background:#fff}
  .login-layout{min-height:100dvh;border:0;border-radius:0;box-shadow:none}
  .login-story{min-height:230px;padding-bottom:30px}
  .login-story h1{font-size:clamp(32px,8vw,39px)}
  .login-story-features{display:none}
  .login-panel{min-height:calc(100dvh - 224px);padding-bottom:max(38px,env(safe-area-inset-bottom));background:#fff}
  .login-panel-inner{padding-bottom:6px}
  .login-pin-wrap .pin-digit{height:58px}
}
@media(max-width:360px){.login-pin-wrap .login-pin-digits{gap:6px}.login-pin-wrap .pin-digit{height:53px;font-size:25px}.login-pin-wrap{gap:7px}}
@media(min-width:761px) and (max-height:800px){.login-page-shell{padding:18px}}
@media(prefers-reduced-motion:reduce){.login-submit.is-loading .login-arrow:after,.login-pin-field.verifying .pin-digit{animation-duration:1.5s}}
