:root{--fs-note:12px;--fs-body:14px;--fs-title:16px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;font-size:var(--fs-body);color:#202326;background:#f5f6f8;font-synthesis:none;--surface:#fff;--canvas:#f5f6f8;--ink:#202326;--muted:#727a83;--line:#e6e9ed;--accent:#007f78;--accent-soft:#e4f8f6;--danger:#b43e42;--shadow:0 16px 60px #1221260f}
*{box-sizing:border-box}body{margin:0;background:var(--canvas)}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.46;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.login{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.intro{background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:48px 64px;min-width:0}
.brand{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:650;letter-spacing:-.3px}.brand small{display:block;font-size:var(--fs-note);color:var(--muted);font-weight:450;letter-spacing:1px;margin-top:2px}
.mark{display:grid;place-items:center;width:34px;height:34px;background:var(--ink);border-radius:9px;color:#fff;font-size:17px;font-weight:750;letter-spacing:0}.brand{letter-spacing:1.5px;font-weight:750}.brand small{letter-spacing:0}
.pitch{max-width:520px}h1{font-size:30px;line-height:1.3;font-weight:650;letter-spacing:-.8px;margin:0 0 14px}.pitch>p{margin:0;color:var(--muted);font-size:var(--fs-title);line-height:1.7}
.tiles{list-style:none;padding:0;margin:32px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.tiles li{background:var(--canvas);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:4px}.tiles strong{font-weight:620}.tiles span{font-size:var(--fs-note);color:var(--muted);line-height:1.6}
.foot,.note{font-size:var(--fs-note);color:var(--muted);line-height:1.6;margin:0}.note.center{text-align:center}
.card{align-self:center;justify-self:center;width:min(400px,100%);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:36px;display:flex;flex-direction:column;gap:18px;box-shadow:var(--shadow);margin:48px 24px}
h2{font-size:22px;font-weight:650;margin:0;letter-spacing:-.4px}.card>.note:first-of-type{font-size:var(--fs-body);margin-top:-12px}
.field{display:flex;flex-direction:column;gap:6px}
input{width:100%;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink)}input::placeholder{color:var(--muted)}input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}
.pw{position:relative;display:block}.pw input{padding-right:64px}.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);min-height:32px;padding:0 10px;border:0;background:transparent;color:var(--accent);font-weight:550;border-radius:6px}
.error{min-height:18px;font-size:var(--fs-note);color:var(--danger);margin:-6px 0 0;line-height:1.6}
.primary{min-height:44px;border:0;border-radius:8px;background:var(--ink);color:#fff;font-weight:600;padding:0 16px}.primary:hover:not(:disabled){background:#000}
@media (max-width:900px){.login{grid-template-columns:1fr}.intro{border-right:0;border-bottom:1px solid var(--line);padding:32px 24px;gap:28px}.tiles{grid-template-columns:1fr}.card{margin:24px auto 48px;padding:28px 24px}h1{font-size:24px}}