:root { --navy:#0a1628; --navy-soft:#173554; --indigo:#30349a; --indigo-dark:#25297f; --surface:#f3f3fc; --surface-strong:#e9e9f6; --line:#d8dae9; --text:#272d40; --muted:#687084; --white:#fff; }
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; background: #eef0f6; color: var(--text); font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input { font: inherit; }
a { color: inherit; }
.access-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(310px, .8fr) minmax(480px, 1.2fr); }
.access-brand { position: relative; display: flex; min-height: 100vh; flex-direction: column; overflow: hidden; padding: 2rem clamp(2rem,5vw,5rem); background: linear-gradient(145deg,#071426 0%,#0a1628 46%,#173554 100%); color: #fff; }
.access-brand::before { content:""; position:absolute; right:-190px; bottom:-180px; width:520px; height:520px; border:1px solid rgba(174,178,220,.13); border-radius:50%; box-shadow:0 0 0 65px rgba(174,178,220,.035),0 0 0 130px rgba(174,178,220,.025); pointer-events:none; }
.access-brand::after { content:""; position:absolute; inset:0; opacity:.14; background-image:radial-gradient(circle at 1px 1px,#aeb2dc 1px,transparent 0); background-size:34px 34px; mask-image:linear-gradient(to bottom,black,transparent 70%); pointer-events:none; }
.access-home { position:relative; z-index:2; display:inline-flex; min-height:38px; width:fit-content; align-self:flex-end; align-items:center; gap:.45rem; padding:.45rem .7rem; border:1px solid rgba(255,255,255,.18); border-radius:8px; background:rgba(255,255,255,.07); color:#d9e1e7; font-size:.72rem; font-weight:750; text-decoration:none; transition:background .16s,border-color .16s,transform .16s; }
.access-home:hover { border-color:rgba(255,255,255,.32); background:rgba(255,255,255,.13); color:#fff; transform:translateY(-1px); }
.access-brand-content { position:relative; z-index:1; width:min(100%,470px); margin:auto 0; }
.access-logo { width:82px; height:82px; margin-bottom:1.15rem; border:3px solid rgba(255,255,255,.28); border-radius:50%; background:#fff; object-fit:cover; box-shadow:0 14px 35px rgba(0,0,0,.2); }
.access-brand-kicker { display:block; margin-bottom:.45rem; color:#aeb2dc; font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.access-brand h1 { max-width:420px; margin:0 0 .8rem; font-size:clamp(2rem,4vw,3.7rem); font-weight:850; line-height:1.02; letter-spacing:-.05em; }
.access-brand-content > p { max-width:410px; margin:0; color:#b9c5d0; font-size:.92rem; line-height:1.7; }
.access-trust-list { display:grid; gap:.65rem; margin-top:2rem; }
.access-trust-list span { display:flex; align-items:center; gap:.65rem; color:#dbe3e9; font-size:.76rem; font-weight:650; }
.access-trust-list i { display:grid; width:27px; height:27px; place-items:center; border:1px solid rgba(174,178,220,.22); border-radius:7px; background:rgba(255,255,255,.07); color:#bfc2ee; }
.access-brand-foot { position:relative; z-index:1; margin:0; color:#8fa0ae; font-size:.68rem; }
.access-workspace { display:flex; min-height:100vh; flex-direction:column; align-items:center; justify-content:center; padding:clamp(1rem,4vw,4rem); background:linear-gradient(180deg,#f8f8fe,#eeeeFA); }
.access-card { width:min(100%,520px); overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 18px 45px rgba(38,43,91,.11); }
.access-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.5rem 1.5rem 1.15rem; }
.access-heading-copy { min-width:0; }
.access-eyebrow { display:block; margin-bottom:.35rem; color:var(--indigo); font-size:.62rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.access-card-head h2 { margin:0 0 .35rem; font-size:1.55rem; font-weight:850; letter-spacing:-.035em; }
.access-card-head p { margin:0; color:var(--muted); font-size:.76rem; }
.access-secure-badge { display:inline-flex; flex:0 0 auto; align-items:center; gap:.3rem; padding:.3rem .48rem; border:1px solid #c9dfd8; border-radius:999px; background:#eff8f5; color:#28735d; font-size:.59rem; font-weight:800; letter-spacing:.02em; }
.access-tabs { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid #e5e7f0; border-bottom:1px solid #e5e7f0; background:#fbfbfe; }
.access-tab { display:inline-flex; min-height:52px; align-items:center; justify-content:center; gap:.45rem; border:0; border-bottom:3px solid transparent; background:transparent; color:#7b8294; font-size:.78rem; font-weight:750; cursor:pointer; }
.access-tab:hover { background:#f5f5fb; color:var(--indigo); }
.access-tab.is-active { border-bottom-color:var(--indigo); background:#fff; color:var(--indigo); }
.access-tab:focus-visible,.access-control:focus-within,.access-submit:focus-visible,.access-password-toggle:focus-visible,.access-home:focus-visible { outline:3px solid rgba(48,52,154,.22); outline-offset:2px; }
.access-notice { display:flex; align-items:flex-start; gap:.55rem; margin:1rem 1.5rem 0; padding:.7rem .75rem; border:1px solid #f0c6c2; border-radius:7px; background:#fff5f4; color:#a63228; font-size:.73rem; line-height:1.45; }
.access-panel { display:none; padding:1.25rem 1.5rem 1.4rem; }
.access-panel.is-active { display:block; }
.access-panel-title { display:flex; align-items:center; gap:.7rem; margin-bottom:1.15rem; }
.access-panel-title > span { display:grid; width:38px; height:38px; flex:0 0 38px; place-items:center; border-radius:8px; background:var(--surface-strong); color:var(--indigo); }
.access-panel-title h3 { margin:0 0 .12rem; font-size:.88rem; font-weight:800; }
.access-panel-title p { margin:0; color:var(--muted); font-size:.67rem; }
.access-form { display:grid; gap:.9rem; }
.access-field label { display:block; margin-bottom:.38rem; color:#41495d; font-size:.7rem; font-weight:800; }
.access-label-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.access-label-row a { margin-bottom:.38rem; color:var(--indigo); font-size:.65rem; font-weight:750; text-decoration:none; }
.access-label-row a:hover { text-decoration:underline; }
.access-control { display:flex; min-height:44px; align-items:center; border:1px solid #cfd3df; border-radius:8px; background:#fff; transition:border-color .16s,box-shadow .16s; }
.access-control:focus-within { border-color:#777cc1; box-shadow:0 0 0 3px rgba(48,52,154,.1); outline:0; }
.access-control > i { width:42px; flex:0 0 42px; color:#858da0; text-align:center; }
.access-control input { width:100%; min-width:0; height:42px; border:0; outline:0; background:transparent; color:var(--text); font-size:.78rem; }
.access-control input::placeholder { color:#a1a7b5; }
.access-password-toggle { display:grid; width:42px; height:42px; flex:0 0 42px; place-items:center; border:0; background:transparent; color:#7b8294; cursor:pointer; }
.access-submit { display:flex; min-height:45px; align-items:center; justify-content:center; gap:.55rem; margin-top:.15rem; border:0; border-radius:8px; background:var(--indigo); color:#fff; font-size:.78rem; font-weight:800; cursor:pointer; transition:background .16s,transform .16s; }
.access-submit:hover { background:var(--indigo-dark); transform:translateY(-1px); }
.access-register,.access-security { margin:1rem 0 0; color:var(--muted); font-size:.68rem; text-align:center; }
.access-register a { color:var(--indigo); font-weight:800; text-decoration:none; }
.access-security { display:flex; align-items:center; justify-content:center; gap:.35rem; }
.access-copyright { margin:1rem 0 0; color:#858da0; font-size:.62rem; }
@media (max-width:850px) { .access-shell{grid-template-columns:1fr}.access-brand{min-height:78px;padding:1rem 1.1rem}.access-brand::before,.access-brand::after,.access-brand-content>p,.access-trust-list,.access-brand-foot{display:none}.access-home{position:absolute;z-index:3;top:50%;right:1rem;min-height:36px;padding:.4rem .62rem;transform:translateY(-50%)}.access-home:hover{transform:translateY(calc(-50% - 1px))}.access-brand-content{display:flex;align-items:center;justify-content:flex-start;gap:.7rem;margin:0;padding-right:5rem}.access-logo{width:46px;height:46px;margin:0}.access-brand-kicker{display:none}.access-brand h1{margin:0;font-size:1rem;letter-spacing:-.02em}.access-workspace{min-height:calc(100vh - 78px);padding:1rem}.access-card{max-width:520px}.access-copyright{margin-bottom:.25rem}}
@media (max-width:480px) { .access-workspace{justify-content:flex-start}.access-card-head{padding:1.15rem 1rem .9rem}.access-card-head h2{font-size:1.3rem}.access-secure-badge{padding:.28rem .4rem}.access-panel{padding:1rem}.access-notice{margin:.8rem 1rem 0}.access-tab{min-height:48px}.access-copyright{display:none} }
@media (prefers-reduced-motion:reduce) { *{scroll-behavior:auto!important;transition:none!important} }
