/* SmilhY Dice v2.0 — accessible responsive Supabase login / registration */
.account-entry{font-size:12px;min-height:39px;padding:0 13px}
.signup-entry{font-size:12px;min-height:39px;padding:0 14px}
.auth-layer{position:fixed;inset:0;z-index:250;display:grid;place-items:center;padding:16px;isolation:isolate}
.auth-scrim{position:absolute;inset:0;background:rgba(2,6,18,.83);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.auth-dialog{position:relative;width:min(100%,470px);max-height:min(92dvh,860px);overflow:auto;overscroll-behavior:contain;background:linear-gradient(155deg,#172147,#0b142a 55%,#080e1e);border:1px solid #475eaa;border-radius:23px;box-shadow:0 32px 130px #000c,0 0 65px #6738c725;padding:30px;outline:0;color:#f8f9ff}
.auth-dialog:before{content:'';position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#a047ff,#32f5dd,#16ff9a);border-radius:24px 24px 0 0}
.auth-close{position:absolute;top:18px;right:20px;background:#1a2847;border:1px solid #324b73;color:#d4e1ff;width:35px;height:35px;border-radius:50%;font-size:17px}
.auth-topmark{display:flex;align-items:center;gap:9px;font-size:19px;font-weight:850;letter-spacing:-.5px}
.auth-dice{font-size:26px}.auth-badge{display:inline-block;font-size:10px;letter-spacing:1px;font-weight:750;color:#9debd8;border:1px solid #2d806d;background:#10342f;padding:6px 10px;border-radius:20px;margin-top:20px}
.auth-dialog h2{font-size:clamp(25px,5vw,32px);line-height:1.1;letter-spacing:-.9px;margin:12px 0 6px}.auth-subtitle{color:#aab9d5;font-size:13px;line-height:1.5;margin:0 0 18px}
.auth-tabs{display:flex;gap:5px;background:#080f20;border:1px solid #29395e;padding:5px;border-radius:12px;margin:14px 0 22px}.auth-tabs button{border:0;border-radius:8px;min-height:39px;flex:1;color:#a9b8d0;background:transparent;font-size:13px;font-weight:750}.auth-tabs button.active{background:#263c63;color:#6ff6cf;box-shadow:0 1px 9px #0005}
.auth-form{display:flex;flex-direction:column;gap:8px}.auth-form label:not(.auth-check){font-size:12px;font-weight:650;color:#dfeafd;margin-top:8px}.auth-form input:not([type=checkbox]){width:100%;min-width:0;min-height:46px;padding:10px 13px;border-radius:10px;background:#0a1225;border:1px solid #30446d;color:#fff;outline:0;font-size:14px;transition:border-color .2s,box-shadow .2s}.auth-form input::placeholder{color:#7185a7}.auth-form input:focus{border-color:#47dbbc;box-shadow:0 0 0 3px #1ddab527}.auth-hint{color:#97aac5;font-size:11px;line-height:1.3}.auth-link{color:#64f6cc;border:0;background:none;font-size:12px;padding:5px 0;align-self:flex-start;text-decoration:none;font-weight:650}.auth-link:hover{text-decoration:underline}.auth-link.align-right{align-self:flex-end}.auth-submit{width:100%;min-height:49px;margin-top:13px;font-size:14px}.auth-submit span{margin-left:auto;font-size:18px}.auth-bottom-note{font-size:12px;color:#9daecd;text-align:center;margin:13px 0 0}.auth-bottom-note .auth-link{font-size:12px}.auth-check{display:flex;gap:10px;align-items:flex-start;margin-top:12px;color:#adbfda;font-size:12px;line-height:1.45;cursor:pointer}.auth-check input{accent-color:#2cedb6;width:16px;height:16px;flex:none;margin:1px 0 0}.auth-helper{color:#9fb1ce;font-size:12px;line-height:1.55;margin:0 0 8px}
.auth-message{border-radius:10px;padding:11px 12px;margin-bottom:15px;border:1px solid #3d6c81;background:#102d40;color:#c9efff;font-size:12px;line-height:1.5;overflow-wrap:anywhere}.auth-message.error{color:#ffd0d5;background:#401e30;border-color:#99425f}.auth-message.success{color:#b0fce0;background:#123a35;border-color:#247f62}.auth-setup-note{border-radius:10px;padding:11px 12px;margin-bottom:17px;background:#342818;border:1px solid #8b642f;color:#ffe4b0;font-size:12px;line-height:1.55}.auth-setup-note code{font-size:11px;color:#fff3d5}
.auth-footer{border-top:1px solid #273658;color:#8f9fbb;font-size:10px;text-align:center;margin-top:23px;padding-top:17px;line-height:1.4}
.auth-user-card{display:flex;gap:12px;align-items:center;padding:15px;border:1px solid #2b4468;border-radius:14px;background:#10243b;margin:14px 0}.auth-avatar{height:43px;width:43px;background:linear-gradient(135deg,#4826bb,#2fc4cc);display:grid;place-items:center;border-radius:50%;font-size:22px;flex:none}.auth-user-card>div:nth-child(2){flex:1;min-width:0}.auth-user-card strong{display:block;font-size:16px;overflow-wrap:anywhere}.auth-user-card small{color:#97aac5;font-size:11px;overflow-wrap:anywhere;display:block;margin-top:3px}.auth-status{font-size:10px;color:#3ee9b9;white-space:nowrap}
.auth-account-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.auth-account-stats>div{border:1px solid #223c61;background:#09182f;border-radius:11px;padding:15px 12px;min-width:0}.auth-account-stats span{display:block;font-size:11px;color:#91aacb}.auth-account-stats strong{display:block;font-size:14px;margin-top:7px;color:#fff;overflow-wrap:anywhere}.auth-edit-form{margin-top:11px}.auth-account-buttons{display:flex;gap:10px;margin-top:18px}.auth-account-buttons button{flex:1;min-width:0}.auth-account .auth-helper{margin-top:16px}
@media(max-width:1350px) and (min-width:901px){.signup-entry{display:none}}
@media(max-width:900px){.account-entry,.signup-entry{display:none}}
@media(max-width:480px){.auth-layer{padding:8px;align-items:center}.auth-dialog{width:100%;max-height:96dvh;padding:22px 19px;border-radius:17px}.auth-badge{margin-top:15px}.auth-tabs{margin-bottom:16px}.auth-form input:not([type=checkbox]){min-height:44px}.auth-account-stats{gap:7px}.auth-account-stats>div{padding:12px 9px}.auth-user-card{padding:12px 10px}.auth-status{font-size:9px}}
@media(max-width:359px){.auth-dialog{padding:18px 14px}.auth-user-card{gap:8px}.auth-avatar{width:35px;height:35px;font-size:18px}.auth-account-buttons{flex-direction:column}}


/* v3.1 | Compact account modal. No scrollbar INSIDE dialog.
   If a phone's viewport is shorter than the form, scroll the overlay itself;
   never clip fields or trap the submit button off screen. */
.auth-layer {
  display: flex;
  justify-content: center;
  align-items: safe center;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 12px max(10px, env(safe-area-inset-right)) 12px max(10px, env(safe-area-inset-left));
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.auth-layer::-webkit-scrollbar { display: none; }
.auth-dialog {
  width: min(100%, 485px);
  max-height: none;
  overflow: visible;
  flex: none;
  padding: 22px 25px 20px;
  border-radius: 21px;
}
.auth-layer[data-mode="signup"] .auth-dialog { width: min(100%, 545px); }
.auth-close { top: 14px; right: 15px; width: 34px; height: 34px; }
.auth-topmark { font-size: 19px; }
.auth-dice { font-size: 24px; }
.auth-badge { margin-top: 10px; padding: 5px 10px; }
.auth-dialog h2 { margin: 9px 0 3px; font-size: clamp(24px, 4.5vw, 29px); }
.auth-subtitle { margin: 0 0 10px; font-size: 12px; }
.auth-tabs { margin: 10px 0 12px; padding: 4px; }
.auth-tabs button { min-height: 36px; }
.auth-form { gap: 6px; }
.auth-form label:not(.auth-check) { margin-top: 5px; }
.auth-form input:not([type=checkbox]) { min-height: 42px; padding: 8px 11px; }
.auth-hint { font-size: 10px; }
.auth-check { margin-top: 7px; font-size: 11px; gap: 8px; }
.auth-submit { min-height: 45px; margin-top: 9px; }
.auth-bottom-note { margin: 7px 0 0; }
.auth-footer { margin-top: 13px; padding-top: 11px; }
.auth-message { margin-bottom: 10px; padding: 9px 11px; }
.auth-setup-note { margin-bottom: 10px; padding: 9px 11px; }
.auth-signup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 12px;
  row-gap: 9px;
}
.auth-signup-grid .auth-field { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.auth-signup-grid .auth-field label { margin: 0; font-size: 12px; }
.auth-signup-grid .auth-field input { width: 100%; }
.auth-signup-grid .auth-hint { line-height: 1.25; }
.auth-signup-grid > .auth-check,
.auth-signup-grid > .auth-submit,
.auth-signup-grid > .auth-bottom-note { grid-column: 1 / -1; }
.auth-signup-grid > .auth-check { margin-top: 0; }
.auth-signup-grid > .auth-submit { margin-top: 0; }
.auth-layer[data-mode="signup"] .auth-footer { display: none; }

@media (max-width: 560px) {
  .auth-dialog { width: min(100%, 460px); padding: 18px 19px 17px; border-radius: 17px; }
  .auth-layer[data-mode="signup"] .auth-dialog { width: min(100%, 460px); }
  .auth-signup-grid { grid-template-columns: 1fr; row-gap: 8px; }
  .auth-signup-grid .auth-field { gap: 4px; }
  .auth-signup-grid .auth-hint { font-size: 9px; }
  .auth-form input:not([type=checkbox]) { min-height: 41px; }
  .auth-badge { margin-top: 7px; }
  .auth-dialog h2 { margin-top: 8px; }
  .auth-tabs { margin: 9px 0 10px; }
  .auth-tabs button { min-height: 35px; }
  .auth-check { margin-top: 4px; }
  .auth-submit { min-height: 43px; margin-top: 7px; }
}
@media (max-width: 359px) {
  .auth-layer { padding: 7px; }
  .auth-dialog { padding: 15px 14px; }
  .auth-close { top: 11px; right: 11px; }
  .auth-dialog h2 { font-size: 24px; }
  .auth-subtitle { font-size: 11px; }
  .auth-signup-grid { row-gap: 7px; }
  .auth-signup-grid .auth-field input { min-height: 39px; }
  .auth-signup-grid .auth-hint { font-size: 9px; }
  .auth-check { font-size: 10px; line-height: 1.3; }
}
@media (max-height: 620px) {
  .auth-layer { align-items: flex-start; }
}
/* Make exceptionally short displays even more compact before allowing overlay scrolling. */
@media (max-height: 620px) {
  .auth-layer[data-mode="signup"] .auth-badge,
  .auth-layer[data-mode="signup"] .auth-subtitle { display: none; }
}
/* Premium desktop header keeps Sign Up visible. Compact flex navigation frees room. */
@media (min-width:901px) and (max-width:1350px){.signup-entry{display:inline-flex}}

/* v6.3.16: hide obsolete account-demo heading in every auth state. */
.auth-dialog .auth-badge { display: none !important; }