/* Email sign-up form ("Get the next scime Dispatch and a monthly field update"), used on the atlas, the Dispatch
   editions, the research and venue pages and the server-rendered sign-up pages. Colours come from the page
   (--ink/--bg on most pages, --paper on the editions), so the form fits each design. */
.subf{margin:0;max-width:560px;font:inherit;color:inherit}
.subf-h{margin:0 0 8px;font-weight:600;font-size:1.02em;line-height:1.35}
.subf-row{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.subf-field{flex:1 1 220px;min-width:0;display:flex}
.subf input[type=email]{flex:1;min-width:0;min-height:44px;box-sizing:border-box;padding:0 12px;border:1px solid var(--line,var(--hair,#cfcac0));border-radius:10px;
  background:var(--panel,var(--paper,#fff));color:var(--ink,#141414);font:inherit;font-size:16px}
.subf input[type=email]:focus{outline:2px solid var(--focus,var(--accent,#1167e8));outline-offset:1px}
.subf button{min-height:44px;padding:0 18px;border:0;border-radius:10px;background:var(--ink,#141414);color:var(--bg,var(--paper,#fff));font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.subf button:disabled{opacity:.6;cursor:default}
.subf-note{margin:8px 0 0;font-size:.82em;line-height:1.45;color:var(--muted,var(--grey,#5d6778))}
.subf-note a{color:inherit}
.subf-msg{margin:8px 0 0;font-size:.9em;line-height:1.45}
.subf-msg.err{color:var(--bad,#b3261e)}
.subf-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.subf-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.subf.done .subf-row,.subf.done .subf-note{display:none}
/* a boxed version for the end of a page */
.subbox{margin:28px 0 8px;padding:16px 18px;border:1px solid var(--line,var(--hair,#cfcac0));border-radius:14px;background:var(--panel,transparent)}
/* server-rendered sign-up, confirm and unsubscribe pages (with /share.css) */
.subpage .subf{margin:24px auto 0;text-align:left}
.subpage form{margin:0}
.subpage .subbtn{margin:22px auto 0;border:0;cursor:pointer;font:inherit;font-weight:600}
.subtop .brand{min-height:44px}
/* hidden by /subscribe.js when the server cannot send email */
.subhidden{display:none!important}
@media print{.subf,.subbox{display:none!important}}
