/* ===== Quick Signin trigger button (Gridchin DS — accent pink) ===== */
.btn-quick-signin{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:var(--gr-pink,#ff90e9);color:var(--gr-black,#000);
  border:1px solid var(--gr-black,#000);
  border-radius:var(--radius-3,12px);
  padding:0 20px;height:50px;min-height:50px;
  font-family:var(--font-sans,'Manrope','IBM Plex Sans',-apple-system,sans-serif);
  font-weight:700;font-size:15px;
  cursor:pointer;text-decoration:none;
  transition:transform .15s ease,box-shadow .15s ease;
  box-shadow:var(--shadow-1,2px 2px 0 0 #000);
  box-sizing:border-box;white-space:nowrap;
}
.btn-quick-signin:hover{
  transform:translate(-2px,-2px);
  box-shadow:var(--shadow-1-hover,4px 4px 0 0 #000);
  background:var(--gr-pink,#ff90e9);
  color:var(--gr-black,#000);
}
.btn-quick-signin:active{transform:translate(0,0);box-shadow:var(--shadow-1-press,1px 1px 0 0 #000)}
.btn-quick-signin svg{flex-shrink:0}
.btn-quick-signin--centered{margin:0 auto}

/* ===== Quick Signin (Email-OTP + Google) modal ===== */
body.qs-modal-open{overflow:hidden}
.qs-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:none;align-items:center;justify-content:center;z-index:9999;opacity:0;transition:opacity .25s ease;padding:20px;box-sizing:border-box}
.qs-overlay.qs-show{display:flex;opacity:1}
.qs-modal{background:#fff;border-radius:20px;padding:32px 28px;max-width:420px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25);position:relative;font-family:'Onest','Inter',-apple-system,sans-serif;color:#1A1A1A;box-sizing:border-box}
.qs-close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:28px;line-height:1;color:#71717A;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;transition:background .15s}
.qs-close:hover{background:#F3F2EE}
.qs-title{font-weight:700;font-size:22px;margin:0 0 8px;text-align:center}
.qs-subtitle{font-size:14px;color:#71717A;text-align:center;margin:0 0 22px;line-height:1.45}
.qs-step{display:none;flex-direction:column;gap:14px}
.qs-step.qs-active{display:flex}
/* Quick-signin uses Gridchin DS classes (.btn-primary, .btn-secondary)
   for styling. Both auth buttons are .btn-secondary so they share
   identical height/padding/typography — only the leading SVG icon
   differentiates Google from email. .qs-btn-block stretches them to
   modal width since DS defaults to inline auto-width. */
.qs-btn-block{width:100%}
.qs-btn-icon{flex-shrink:0;display:block}
.qs-btn-link{background:none;border:none;color:#71717A;font-family:inherit;font-size:13px;cursor:pointer;padding:8px;text-align:center;text-decoration:underline}
.qs-btn-link:hover{color:#1A1A1A}
.qs-method-link{margin-top:-4px}
.qs-divider{display:flex;align-items:center;gap:12px;color:#A1A1A1;font-size:12px;margin:4px 0}
.qs-divider::before,.qs-divider::after{content:"";flex:1;height:1px;background:#E8E6E1}
.qs-hint{font-size:12px;color:#A1A1A1;text-align:center;margin-top:-6px}
.qs-input{width:100%;border:1px solid #E8E6E1;border-radius:12px;padding:14px 16px;font-family:inherit;font-size:15px;box-sizing:border-box;background:#FAFAF7;color:#1A1A1A;transition:border-color .15s,background .15s;min-height:48px}
.qs-input:focus{outline:none;border-color:#1A1A1A;background:#fff}
.qs-input.qs-input-error{border-color:#D43A3A;background:#FFF6F6}
.qs-error{font-size:13px;color:#D43A3A;text-align:left;margin:0;line-height:1.4}
.qs-info{font-size:13px;color:#71717A;text-align:center;margin:0;line-height:1.4}
.qs-code-row{display:flex;gap:8px;justify-content:center}
.qs-code-cell{width:44px;height:56px;border:1px solid #E8E6E1;border-radius:12px;font-family:inherit;font-size:24px;font-weight:600;text-align:center;background:#FAFAF7;color:#1A1A1A;-moz-appearance:textfield;box-sizing:border-box}
.qs-code-cell::-webkit-outer-spin-button,.qs-code-cell::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qs-code-cell:focus{outline:none;border-color:#1A1A1A;background:#fff}
.qs-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#1A1A1A;color:#fff;padding:12px 20px;border-radius:12px;font-family:'Onest',-apple-system,sans-serif;font-size:14px;z-index:10000;box-shadow:0 10px 30px rgba(0,0,0,.25);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}
.qs-toast.qs-toast-show{opacity:1;transform:translateX(-50%) translateY(-4px)}
.qs-back-row{display:flex;justify-content:flex-start;margin-bottom:-6px}
.qs-back-row .qs-btn-link{padding:4px 0;text-decoration:none;font-size:14px}

@media(max-width:480px){
  .qs-modal{padding:24px 20px;border-radius:18px}
  .qs-title{font-size:20px}
  .qs-code-row{gap:6px}
  .qs-code-cell{width:38px;height:52px;font-size:22px}
}