/* Sign-in and account pages. The card follows the Mac app's login: black, one thin border, nothing else. */
html,body{background:var(--night)}
:root{--dusk-1:#A5A5C7;--dusk-2:#7283AA;--dusk:linear-gradient(100deg,#A5A5C7 0%,#7283AA 100%)}
.au-body{overflow-x:hidden}
.au{min-height:100svh;padding:20px;display:grid;place-items:stretch}
.au__card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:calc(100svh - 40px);border:1px solid var(--line);border-radius:24px;background:#0D0D10;overflow:hidden}
/* left: the art panel, itself inset */
.au__art{position:relative;overflow:hidden;margin:14px;border-radius:16px;background:#0B0B0B;border:1px solid var(--line);padding:26px 28px;display:flex;flex-direction:column}
.au__brand{display:inline-flex;align-items:center;z-index:4;position:relative}
.au__brand img{height:24px;width:auto;display:block}
.au__dapple{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.au__chip{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px;border-radius:999px;border:1px solid rgba(244,242,238,.1);background:rgba(20,20,23,.92);
  color:var(--text-2);font:500 12.5px/1 var(--font);box-shadow:0 12px 30px rgba(0,0,0,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.au__chip svg{width:14px;height:14px;flex:none}
.au__chip--pill{left:9%;top:21%;color:var(--text)}
.au__chip--wifi{right:9%;bottom:33%;color:var(--frozen)}
.au__win{position:absolute;z-index:2;left:52%;top:47%;width:min(380px,76%);transform:translate(-50%,-50%) rotate(-1deg);border-radius:14px;background:rgba(17,17,19,.96);border:1px solid rgba(244,242,238,.1);
  box-shadow:0 30px 80px rgba(0,0,0,.65);padding:0 0 12px;font:400 13px/1.45 var(--font);color:var(--text-2)}
.au__win-bar{height:32px;display:flex;align-items:center;gap:6px;padding:0 14px}.au__win-bar i{width:9px;height:9px;border-radius:50%;background:#3a3a3e;display:block}
.au__win-q{margin:2px 16px 10px auto;width:max-content;max-width:72%;padding:8px 12px;border-radius:12px;background:#232326;color:var(--text)}
.au__win-a{margin:0 16px;color:var(--text-2)}
.au__win-src{margin:8px 16px 12px;font-size:11px;color:var(--text-3)}.au__win-src b{color:var(--mist);font-weight:500}
.au__win-in{margin:0 12px;border-radius:12px;border:1px solid rgba(244,242,238,.08);background:#151517;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;color:var(--text-3);font-size:13px;gap:10px}
.au__win-model{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;background:#232326;color:var(--text);font:500 11.5px/1 var(--font);white-space:nowrap}
.au__win-model img{width:12px;height:12px;opacity:.9}
.au__tag{position:relative;z-index:4;margin:auto 0 0;font:600 clamp(28px,2.8vw,38px)/1.1 var(--display);letter-spacing:-.03em;color:var(--text)}
.au__tag em{font-family:"Libre Baskerville",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.02em;background:var(--dusk);-webkit-background-clip:text;background-clip:text;color:transparent}
/* right: the form pane */
.au__pane{display:flex;flex-direction:column;padding:28px 32px;background:transparent}
.au__brand--pane{display:inline-flex;margin-bottom:34px}
.au__form-wrap{margin:auto;width:100%;max-width:360px}
.au__form-wrap .au__brand img{height:26px}
.au__h{margin:0;font:600 clamp(26px,2.2vw,32px)/1.1 var(--display);letter-spacing:-.03em;color:var(--text)}
.au__sub{margin:10px 0 24px;font:400 14px/1.55 var(--font);color:var(--mist)}
.au__err{margin:0 0 16px;padding:10px 12px;border-radius:10px;border:1px solid rgba(244,242,238,.12);font:400 13px/1.45 var(--font);color:var(--text-2)}
.au__form{display:grid;gap:8px}
.au__label{font:500 12px/1 var(--font);color:var(--mist)}
.au__input{height:46px;border-radius:12px;border:1px solid var(--line-2);background:rgba(244,242,238,.03);color:var(--text);padding:0 16px;font:400 15px var(--font);outline:none;transition:border-color var(--quick)}
.au__input:focus{border-color:var(--dusk-2);box-shadow:0 0 0 3px rgba(114,131,170,.18)}
.au__btn{height:46px;justify-content:center;font-size:15px;margin-top:8px;border-radius:12px}
.au__btn[disabled]{opacity:.6;cursor:default}
.au__sent-h{margin:4px 0 6px;font:600 17px/1.3 var(--display);color:var(--text)}
.au__sent-p{margin:0 0 12px;font:400 14px/1.5 var(--font);color:var(--mist)}.au__sent-p b{color:var(--text);font-weight:500}
.au__again{background:none;border:0;padding:0;color:var(--mist);font:400 13px/1 var(--font);cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(244,242,238,.25)}
.au__again:hover{color:var(--text)}
.au__or{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--text-3);font:400 12px/1 var(--font)}
.au__or::before,.au__or::after{content:"";flex:1;height:1px;background:var(--line)}
.au__google{display:flex;align-items:center;justify-content:center;gap:10px;height:46px;border-radius:12px;border:1px solid var(--line-2);color:var(--text);text-decoration:none;font:500 15px/1 var(--font);transition:border-color var(--quick),background var(--quick)}
.au__google:hover{border-color:rgba(244,242,238,.28);background:rgba(244,242,238,.04)}
.au__google svg{width:18px;height:18px}
.au__legal{margin:22px 0 0;font:400 12px/1.5 var(--font);color:var(--text-3)}
.au__legal a,.au__swap a{color:var(--text-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(244,242,238,.25)}
.au__swap{margin:28px 0 0;font:400 14px/1.5 var(--font);color:var(--mist)}
.au__swap a{color:var(--dusk-1);text-decoration:none;font-weight:500;border-bottom:1px solid rgba(165,165,199,.35)}
@media (max-width:900px){
  .au{padding:0}
  .au__card{grid-template-columns:1fr;min-height:100svh;border:0;border-radius:0;background:var(--night)}
  .au__art{display:none}
  .au__brand--pane{margin-bottom:40px}
  .au__pane{padding:24px 20px max(32px,env(safe-area-inset-bottom));min-height:100svh}
  .au__form-wrap{margin:0 auto auto}
}
/* account */
.ac{max-width:620px;margin:0 auto;padding:56px var(--pad) max(56px,env(safe-area-inset-bottom))}
.xp__kicker{font:500 12px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--mist);margin:0 0 18px}
.ac__h{margin:0;font:600 clamp(32px,6vw,44px)/1.05 var(--display);letter-spacing:-.03em;color:var(--text)}
.ac__email{margin:10px 0 0;font:400 15px/1.5 var(--font);color:var(--mist)}
.ac__list{list-style:none;margin:36px 0 0;padding:0;border-top:1px solid var(--line-2)}
.ac__row{display:flex;align-items:center;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.ac__row>div{flex:1;min-width:0}
.ac__t{margin:0;font:500 16px/1.3 var(--font);color:var(--text)}
.ac__d{margin:4px 0 0;font:400 14px/1.5 var(--font);color:var(--mist)}
.ac__pill{flex:none;height:26px;padding:0 11px;border-radius:var(--r-pill);border:1px solid var(--line-2);display:inline-flex;align-items:center;font:500 12px/1 var(--font);color:var(--text-2)}
.ac__pill.is-invited{border-color:rgba(165,165,199,.45);background:rgba(114,131,170,.14);color:var(--dusk-1)}
.ac__link{flex:none;color:var(--dusk-1);font:500 14px/1 var(--font);text-decoration:none;border-bottom:1px solid rgba(165,165,199,.35);padding-bottom:2px}
.ac__link:hover{border-color:var(--text)}
.ac__foot{margin:28px 0 0;font:400 13px/1.6 var(--font);color:var(--text-3)}
.ac__danger{background:none;border:0;padding:0;color:var(--text-3);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.ac__danger:hover{color:var(--text-2)}
@media (max-width:480px){.au__card{padding:30px 22px 24px}.ac__row{flex-wrap:wrap}}

/* hidden always wins over component display rules */
.au-body [hidden],.ac [hidden],.nav [hidden]{display:none!important}