/* Chrome the build job's standalone page does not have. The palette variables come from
   _edition.css, which base.html inlines above this file. */
nav.top{display:flex;align-items:center;gap:2ch;max-width:880px;margin:0 auto;padding:16px 20px 0;font-size:13px}
nav.top a{color:var(--forest-glow);text-decoration:none}
nav.top a.brand{color:var(--amber);font-weight:600;letter-spacing:.1ch}
nav.top .spacer{flex:1}
/* The PATH mark (templates/_mark.html): the logo's three bars at text height, next to the
   wordmark in the nav and in the two subscribe headers. currentColor so it takes the amber
   from a.brand and the h1 colour in a masthead; no glow filter, which at this size is mud. */
svg.mark{height:1em;width:auto;fill:currentColor;vertical-align:-.12em;margin-right:.6ch}

nav.top #whoami{color:var(--gray)}
.shaded{opacity:.35;filter:grayscale(1);cursor:not-allowed}
/* QA 2026-09-05 item 4: shaded anchors ARE working links (to the shaded archive list,
   or to the archive subscribe wall), so not-allowed lied. Only shaded controls that
   genuinely cannot be used - the disabled chat panel - keep it. */
a.shaded{cursor:pointer}
button.term{background:transparent;color:var(--forest-glow);border:1px solid var(--forest-dim);
  font-family:var(--mono);font-size:13px;padding:4px 10px;cursor:pointer}
button.term:hover:not(:disabled){box-shadow:0 0 8px rgba(245,166,35,.45);color:var(--amber)}
/* A disabled control has to look disabled. Sign in when [firebase] api_key is empty and
   the trial button when Stripe is unconfigured both render disabled with a title saying
   why; without this they were pixel-identical to working buttons. */
button.term:disabled{opacity:.45;cursor:not-allowed}
button.term:focus-visible,a:focus-visible{outline:2px solid var(--amber);outline-offset:1px}
/* Outside nav.top there is no colour rule, so this link would render browser-default blue
   on the black ground. */
a.term{display:inline-block;border:1px solid var(--forest-dim);padding:6px 12px;
  text-decoration:none;color:var(--forest-glow)}
a.term:hover{box-shadow:0 0 8px rgba(245,166,35,.45);color:var(--amber)}
.panel{border:1px solid var(--forest-dim);background:var(--ink-raised);padding:14px;margin:32px 0}
.panel h2{color:var(--forest-glow);font-size:15px;margin:0 0 10px}
.panel input{background:var(--ink);color:var(--bone);border:1px solid var(--forest-dim);
  font-family:var(--mono);font-size:13px;padding:5px 8px;width:min(48ch,70%)}
ul.archive{list-style:none;padding:0}
ul.archive li{border-bottom:1px solid var(--forest-dim);padding:6px 0}
ul.archive a{color:var(--amber-glow);text-decoration:none}
.notice{color:var(--amber-dim);font-size:13px}

/* The sign-in box (base.html). Hidden until a Sign in control opens it; it lives directly
   under the nav so the message about a failed send is under the button that was pressed. */
/* [hidden] is display:none in the UA sheet, which a class rule with an explicit
   display would silently outrank -- the box would sit open on every page. */
form.signin-box[hidden]{display:none}
form.signin-box{display:flex;flex-wrap:wrap;align-items:center;gap:1ch;
  max-width:880px;margin:10px auto 0;padding:10px 20px;font-size:13px}
form.signin-box label{color:var(--gray)}
form.signin-box input{background:var(--ink);color:var(--bone);border:1px solid var(--forest-dim);
  font-family:var(--mono);font-size:13px;padding:5px 8px;width:min(32ch,60%)}
/* The failure line must not read like the ordinary amber notices around it. */
form.signin-box .signin-msg{flex-basis:100%;margin:4px 0 0;color:var(--amber-dim);font-size:13px}
form.signin-box .signin-msg.bad{color:var(--amber);font-weight:600}
