/* The sign-in page: the welcome page's open space, one ink button, and a small map growing beside it. */
:root { --ink:#0e1116; --sans:"General Sans", ui-sans-serif, system-ui, sans-serif; --title:"Instrument Sans", ui-sans-serif, system-ui, sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; background:#f9f8f4; color:var(--ink); font:400 16px/1.5 var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; }
:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
#bar { height:64px; display:flex; align-items:center; width:100%; max-width:1400px; margin:0 auto; padding:0 32px; }
.logo { display:inline-flex; align-items:center; gap:7px; color:var(--ink); text-decoration:none; }
.logo .logo-symbol { width:46px; height:auto; overflow:visible; }
.logo .logo-wordmark { width:104px; height:auto; }
main { flex:1; width:100%; max-width:1400px; margin:0 auto; padding:0 44px 64px; display:grid; grid-template-columns:minmax(300px,.8fr) minmax(0,1.4fr); align-items:center; gap:48px; }
h1 { margin:0 0 32px; max-width:440px; font:500 clamp(40px,4.2vw,60px)/1.08 var(--title); letter-spacing:-.045em; }
.cta { display:inline-flex; align-items:center; gap:14px; padding:13px 20px 13px 14px; border-radius:4px; background:#202124; color:#fff; font:500 16px/1.2 var(--sans); text-decoration:none; transition:background .15s; }
.cta:hover { background:#44464b; }
.g { display:grid; place-items:center; width:28px; height:28px; border-radius:3px; background:#fff; }
.err { margin:0 0 24px; max-width:400px; padding:12px 14px; background:#FFC6EE; font-size:16px; }
.new { margin:20px 0 0; font-size:16px; }
.pw { display:block; width:max-content; margin-top:20px; padding:4px 0; font-size:16px; text-decoration:underline; text-decoration-color:#aaa8a2; text-underline-offset:5px; }
.pw:hover { text-decoration-color:currentColor; }
.map { position:relative; height:min(560px,70vh); min-width:0; }
.links { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.links line { stroke:#1e2125; stroke-width:1.3; }
.w { position:absolute; left:0; top:0; padding:5px 9px; white-space:nowrap; font:500 23px/1.25 var(--title); letter-spacing:-.01em; will-change:transform; }
.w.d0 { padding:7px 12px; font-size:30px; }
.w.d2 { font-size:18px; padding:4px 8px; }
@media(max-width:900px) {
  main { grid-template-columns:1fr; align-items:start; align-content:start; gap:8px; padding:24px 24px 40px; }
  h1 { font-size:42px; }
  .map { height:clamp(300px, calc(100svh - 340px), 520px); margin-top:16px; } /* the map fits under the button on the first screen */
  .w { font-size:16px; } .w.d0 { font-size:20px; } .w.d2 { font-size:14px; }
}
@media(max-width:520px) { #bar { padding:0 24px; } main { padding-top:16px; } h1 { font-size:36px; margin-bottom:28px; } .cta { padding-top:14px; padding-bottom:14px; } }

/* The privacy page: the same bar, one readable column. */
.doc main { display:block; max-width:720px; padding:48px 32px 96px; }
.doc h1 { margin:0 0 40px; }
.doc h2 { margin:36px 0 10px; font:500 24px/1.25 var(--title); letter-spacing:-.02em; }
.doc p { margin:0; font-size:17px; line-height:1.6; }
