/* Sign-in / sign-up window (signin-modal.js loads account.php's form into it). Matches the homepage's "coming soon" window:
   midnight panel, Fredoka headline with one orange word, Figtree text, orange pill button. Fonts come from fonts.css. */
html.signin-open{overflow:hidden}
#signin-modal{--s-paper:#111119;--s-soft:#191923;--s-field:#1c1b27;--s-ink:#fff5de;--s-muted:#c8c3d4;--s-line:#353244;--s-accent:#ff641c;--s-link:#ff8a4c;
 box-sizing:border-box;width:min(500px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:42px 44px 24px;border:1px solid var(--s-line);border-radius:30px;background:var(--s-paper);color:var(--s-ink);box-shadow:0 30px 100px #0008;font:16px/1.5 Figtree,system-ui,sans-serif;text-align:center}
#signin-modal::backdrop{background:rgba(8,9,27,.7);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#signin-modal .signin-close{position:absolute;right:14px;top:12px;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;font:30px/1 system-ui;cursor:pointer}
#signin-modal main{max-width:none;margin:0;padding:0;animation:none}
#signin-modal .auth-head{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 12px}
#signin-modal .auth-eyes{font-size:2rem;line-height:1}
#signin-modal .eyebrow{margin:0;color:var(--s-accent);font-size:.78rem;font-weight:800;letter-spacing:.14em}
#signin-modal h1,#signin-modal h2{font-family:Fredoka,'Arial Rounded MT Bold',Arial,sans-serif;font-weight:600;letter-spacing:-.035em;line-height:1.02;color:var(--s-ink)}
#signin-modal h1{font-size:3.1rem;margin:0 0 12px}
#signin-modal h1 em,#signin-modal h2 em{font-style:normal;color:var(--s-accent)}
#signin-modal p{color:var(--s-muted);margin:10px 0}
#signin-modal .site-entry-note{font-size:14px;text-align:left}
#signin-modal .auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:22px 0 6px;padding:5px;border:1px solid var(--s-line);border-radius:16px;background:var(--s-soft)}
#signin-modal .auth-tabs a{padding:11px 8px;border-radius:12px;color:var(--s-muted);font-weight:700;text-decoration:none}
#signin-modal .auth-tabs a:hover{color:var(--s-ink)}
#signin-modal .auth-tabs a[aria-current]{background:var(--s-accent);color:#fff;box-shadow:0 6px 16px #ff641c44}
#signin-modal form{text-align:left}
#signin-modal label{display:block;font-weight:700;font-size:.95rem;margin:18px 0 8px}
#signin-modal input{box-sizing:border-box;width:100%;height:54px;padding:0 18px;border:1.5px solid var(--s-line);border-radius:16px;background:var(--s-field);color:inherit;font:inherit;font-size:1.02rem}
#signin-modal input:is([type=email],[type=password],[type=text],[name=name]){padding-left:48px;background-repeat:no-repeat;background-position:17px 50%;background-size:19px}
#signin-modal input[type=email]{background-image:url('assets/icon-mail.svg')}
#signin-modal input[type=password],#signin-modal .pw-wrap input{background-image:url('assets/icon-lock.svg')}
#signin-modal input[name=name]{background-image:url('assets/icon-user.svg')}
#signin-modal input:focus{outline:none;border-color:var(--s-accent);box-shadow:0 0 0 4px #ff641c33}
#signin-modal .pw-wrap{position:relative;display:block}
#signin-modal .pw-wrap input{padding-right:72px}
#signin-modal .pw-show{position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:8px 10px;border:0;border-radius:10px;background:transparent;color:var(--s-muted);font:700 .85rem Figtree,system-ui,sans-serif;cursor:pointer}
#signin-modal .pw-show:hover{color:var(--s-ink)}
#signin-modal .auth-forgot{margin:8px 0 0;text-align:right}
#signin-modal a{color:var(--s-link)}
#signin-modal .auth-forgot a,#signin-modal .links a{font-weight:700;font-size:.92rem;text-decoration:none}
#signin-modal .primary{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:56px;margin:24px 0 6px;padding:14px;border:0;border-radius:18px;background:var(--s-accent);color:#fff;font:700 1.12rem Figtree,system-ui,sans-serif;box-shadow:0 10px 26px #ff641c44;cursor:pointer;transition:transform .2s,filter .2s}
#signin-modal .primary:hover{transform:translateY(-2px);filter:brightness(1.05)}
#signin-modal .primary::after{content:'↗'}
#signin-modal button:disabled{opacity:.55;cursor:wait}
#signin-modal .check{display:flex;gap:10px;align-items:flex-start;font-size:13px;font-weight:400;margin-top:16px}
#signin-modal .check input{width:18px;height:18px;flex:none;margin:2px 0;padding:0;accent-color:var(--s-accent)}
#signin-modal .links{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:14px}
#signin-modal .notice{text-align:left;border-left:3px solid var(--s-accent);padding:12px;border-radius:0 12px 12px 0;background:var(--s-soft)}
#signin-modal footer{margin-top:22px;padding-top:16px;border-top:1px solid var(--s-line);font-size:.8rem}
#signin-modal footer p,#signin-modal .auth-mail,#signin-modal .auth-long{display:none}
#signin-modal .auth-foot{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 0}
#signin-modal .auth-foot a{color:var(--s-muted);text-decoration:none}
#signin-modal .auth-foot a:hover{color:var(--s-ink);text-decoration:underline}
#signin-modal .auth-foot a{white-space:nowrap}#signin-modal .auth-foot a:not(.auth-mail)~a:not(.auth-mail)::before{content:'·';display:inline-block;margin:0 9px;opacity:.6}
#signin-modal :is(a,button,input):focus-visible{outline:3px solid #ffac72;outline-offset:3px}
html[data-mode=light] #signin-modal{--s-paper:#fffaf1;--s-soft:#f6efe4;--s-field:#fff;--s-ink:#171522;--s-muted:#626270;--s-line:#e3d9cc;--s-link:#b8480f}
html[data-mode=light] #signin-modal .eyebrow,html[data-mode=light] #signin-modal h1 em{color:#d9500f}
@media(max-width:480px){#signin-modal{padding:36px 20px 22px}#signin-modal h1{font-size:2.4rem}}

/* Launch waitlist form (index.php?page=register) in the same window. */
#signin-modal h2{font-size:2.3rem;margin:8px 0 18px}
#signin-modal select{width:100%;height:54px;padding:0 14px;border:1.5px solid var(--s-line);border-radius:16px;background:var(--s-field);color:inherit;font:inherit}
#signin-modal .consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;font-weight:400}
#signin-modal .consent input{width:18px;height:18px;flex:none;margin:3px 0;padding:0;accent-color:var(--s-accent)}
#signin-modal .honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#signin-modal .privacy-note{font-size:12px}
#signin-modal .waitlist-modal-form{text-align:left}
#signin-modal .waitlist-modal-form button[type=submit]{width:100%;min-height:56px;margin-top:14px;border:0;border-radius:18px;background:var(--s-accent);color:#fff;font:700 1.08rem Figtree,system-ui,sans-serif;box-shadow:0 10px 26px #ff641c44}
#signin-modal .waitlist-modal-form .text-button{display:block;margin:14px 0;border:0;background:none;color:inherit;font:inherit;font-size:13px;cursor:pointer}
#signin-modal .back-link{display:block;font-size:13px}