/* The boot cover and the sign-in gate stay LIGHT while the workspace behind them is dark.
       Both are pre-app surfaces whose whole content is the AJ logo, and that asset is dark artwork
       composited with mix-blend-mode:multiply — on a charcoal background it vanishes completely.
       Re-declaring the light scale locally keeps every child (card, inputs, hints) consistent
       without touching the logo, which is what "keep the AJ logo unchanged" requires. */
    .boot-cover,.auth-gate{
      --bg:#F6F7F9;--s1:#FFFFFF;--s2:#F1F2F4;--s3:#FFFFFF;
      --b1:#ECECEF;--b2:#DEDFE3;--b3:#C7C8CE;
      --text:#0B0B0F;--t2:#4B4B55;--t3:#8A8B94;--t4:#B7B8C0;
      --sh:0 1px 2px rgba(10,12,20,.04),0 4px 18px rgba(10,12,20,.06)}

    /* ── BOOT COVER ── */
    .boot-cover{position:fixed;inset:0;z-index:10000;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem}
    .boot-cover__logo{width:120px;height:auto;mix-blend-mode:multiply}
    .boot-cover__spin{width:26px;height:26px;border-radius:50%;border:3px solid var(--b2);border-top-color:var(--lime);animation:boot-spin .8s linear infinite}
    @keyframes boot-spin{to{transform:rotate(360deg)}}

    /* ── LOGIN GATE ── */
    .auth-gate{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:1.5rem}
    .auth-card{width:100%;max-width:360px;background:var(--s1);border:1px solid var(--b1);border-radius:var(--rl);box-shadow:0 24px 60px rgba(10,12,20,.12);padding:2.25rem 1.75rem;text-align:center}
    .auth-logo{width:150px;height:auto;display:block;margin:0 auto 1.5rem;mix-blend-mode:multiply}
    .auth-title{font-family:var(--fd);font-weight:700;font-size:1.5rem;letter-spacing:.02em;color:var(--text)}
    .auth-sub{font-family:var(--fs);font-size:.85rem;color:var(--t2);margin:.35rem 0 1.5rem}
    .auth-input{width:100%;margin-bottom:.7rem;text-align:left}
    .auth-pass-wrap{position:relative;margin-bottom:.7rem}
    .auth-pass-wrap .auth-input{margin-bottom:0}
    .auth-show{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-family:var(--fb);font-size:.72rem;font-weight:700;letter-spacing:.02em;color:var(--t3);padding:.25rem .35rem;border-radius:6px}
    .auth-show:hover{color:var(--text)}
    .auth-btn{width:100%;margin-top:.4rem}
    .auth-err{font-family:var(--fb);font-size:.78rem;color:var(--red);min-height:1.1rem;margin-bottom:.4rem;text-align:left}
    .auth-forgot{display:block;margin:1rem auto 0;font-family:var(--fb);font-size:.78rem;font-weight:600;color:var(--t2);text-decoration:underline;text-underline-offset:2px}
    .auth-forgot:hover{color:var(--text)}
    .auth-note{font-family:var(--fb);font-size:.68rem;color:var(--t3);margin-top:1.1rem;line-height:1.4}
    /* ── MORE SIGN-IN OPTIONS ── */
    .auth-more{margin-top:1rem}
    /* The summary keeps its DEFAULT display on purpose. Chromium drops <summary>'s implicit
       disclosure role the moment it is given display:flex, which leaves screen readers announcing
       plain text where a control is — so the flex row that centres the label and its chevron lives
       on an inner span instead, and only the marker is suppressed here. */
    .auth-more__summary{list-style:none;cursor:pointer;padding:.15rem 0}
    .auth-more__summary::-webkit-details-marker{display:none}
    .auth-more__summary::marker{content:''}
    .auth-more__label{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--fb);font-size:.78rem;font-weight:600;color:var(--t3)}
    .auth-more__summary:hover .auth-more__label{color:var(--text)}
    .auth-more__summary:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:6px}
    .auth-more__label::after{content:'';width:.42rem;height:.42rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-.12em) rotate(45deg);transition:transform .18s ease}
    .auth-more[open] .auth-more__label::after{transform:translateY(.06em) rotate(-135deg)}
    /* the first link supplies its own 1rem top margin via .auth-forgot */
    .auth-more__body{margin-top:-.25rem}
    /* code-entry modes open this and drop the summary, leaving a bare "← Back" link */
    .auth-more--bare>.auth-more__summary{display:none}
    .auth-more--bare{margin-top:0}

    /* ── ACCEPT INVITE ── */
    .invite-org{display:flex;flex-direction:column;align-items:center;text-align:center}
    .invite-org__logo{width:88px;height:88px;border-radius:20px;object-fit:cover;background:var(--s2);border:1px solid var(--b1);margin-bottom:1.1rem}
    .invite-org__logo--fallback{display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:800;font-size:2rem;color:var(--t3)}
    .invite-org__name{font-family:var(--fd);font-weight:700;font-size:1.4rem;letter-spacing:-.01em;color:var(--text);line-height:1.15}
    .invite-org__role{display:inline-block;margin-top:.6rem;font-family:var(--fb);font-size:.72rem;font-weight:700;letter-spacing:0;color:var(--lime);background:var(--lime-d);border:1px solid rgba(170,255,0,.3);border-radius:100px;padding:.3rem .8rem}
    .invite-org__expiry{font-family:var(--fb);font-size:.76rem;color:var(--t3);margin-top:.8rem}
    .invite-org__err{font-family:var(--fb);font-size:.85rem;color:var(--t2);margin-top:.5rem;line-height:1.5}
    .invite-accept-btn{width:100%;margin-top:1.6rem}
    .invite-code-toggle{margin-top:1.2rem;text-align:left}
    .invite-code-toggle>summary{font-family:var(--fb);font-size:.78rem;color:var(--t3);cursor:pointer;text-align:center}
    .invite-code-toggle>summary:hover{color:var(--t2)}
    .invite-code-toggle .auth-input{margin-top:.7rem}

    /* ── INVITE SUCCESS ── */
    .invite-success{display:flex;flex-direction:column;align-items:center;text-align:center}
    .invite-success__check{width:64px;height:64px;border-radius:50%;background:var(--lime-d);color:var(--lime);display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem}
    .invite-success__check svg{width:32px;height:32px}
    .invite-success__title{font-family:var(--fd);font-weight:700;font-size:1.25rem;letter-spacing:-.01em;color:var(--text);line-height:1.3}
    .invite-success__title em{font-style:normal;color:var(--lime)}
    .invite-success__btn{width:100%;margin-top:1.6rem}