/* A page with one centred column: the tool pages and the profile page.
   .tool.wide makes the column wider. */
/* .btn sets display, which would otherwise override the hidden attribute. */
.tool [hidden]{display:none!important}
.tool{
  position:relative;z-index:1;
  flex:1;
  width:100%;max-width:720px;margin:0 auto;
  padding:32px clamp(16px,4vw,32px) 56px;
}
.kicker{margin:0 0 16px;font:400 13px var(--mono);color:var(--faint)}
.tool h1{
  margin:0;
  font-size:clamp(34px,6vw,56px);
  font-weight:800;line-height:1.05;letter-spacing:-.04em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  width:fit-content;
}
.msg{margin:14px 0 0;min-height:1.4em;font-size:14px;color:var(--muted)}
.msg.error{color:var(--pink)}

.link-btn{background:none;border:0;padding:4px 0;font:600 13px var(--sans);color:var(--muted)}
.link-btn:hover{color:var(--fg)}
.link-btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:4px}

.btn:disabled{opacity:.5;cursor:default;transform:none}
.tool.wide{max-width:1040px}