/* Maple Blues GM site. Same palette as the staff hub (hub/managers.html), so it feels
   like ours, but nothing is shared with the hub. No external fonts: the CSP only allows
   this site's own files. */
:root {
  --cream: #f6efe3; --cream-2: #efe6d6; --paper: #ffffff; --line: #e6dbc6;
  --espresso: #2a1810; --cocoa: #5b4434; --mute: #8a7660;
  --maple: #b87333; --maple-2: #9a5f2a; --bad: #a8322a; --good: #3d6b3a;
  --serif: "New York", "Hoefler Text", Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root { --cream: #1b1410; --cream-2: #241b15; --paper: #2a201a; --line: #3d3027;
          --espresso: #f3e9dc; --cocoa: #d9c6b0; --mute: #a8927b; --maple: #d08a48; --maple-2: #e09c5a; }
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--sans); background: var(--cream); color: var(--espresso);
       -webkit-text-size-adjust: 100%; }
main { max-width: 560px; margin: 0 auto; padding: 24px 16px 64px; }
h1 { font-family: var(--serif); font-weight: 600; font-size: 28px; margin: 8px 0 4px; }
h2 { font-family: var(--serif); font-weight: 600; font-size: 19px; margin: 0 0 10px; }
p { line-height: 1.5; color: var(--cocoa); }
.sub { color: var(--mute); margin: 0 0 20px; font-size: 14px; }
.card { background: var(--paper); border: 1px solid var(--line); border-radius: 14px;
        padding: 18px; margin: 14px 0; }
button { font: inherit; font-weight: 600; border: 0; border-radius: 12px; padding: 14px 18px;
         background: var(--maple); color: #fff; width: 100%; cursor: pointer; }
button:hover { background: var(--maple-2); }
button.quiet { background: transparent; color: var(--maple-2); border: 1px solid var(--line);
               width: auto; padding: 8px 12px; font-weight: 500; }
button.danger { background: transparent; color: var(--bad); border: 1px solid var(--line);
                width: auto; padding: 6px 10px; font-weight: 500; font-size: 13px; }
button:disabled { opacity: .5; cursor: default; }
input { font: inherit; width: 100%; padding: 12px; border-radius: 10px; border: 1px solid var(--line);
        background: var(--cream-2); color: var(--espresso); margin: 6px 0 12px; }
label { font-size: 14px; color: var(--cocoa); }
a { color: var(--maple-2); }
.row { display: flex; align-items: center; justify-content: space-between; gap: 10px;
       padding: 10px 0; border-top: 1px solid var(--line); }
.row:first-of-type { border-top: 0; }
.row small { color: var(--mute); display: block; }
.msg { padding: 10px 12px; border-radius: 10px; margin: 10px 0; font-size: 14px; }
.msg.bad { background: color-mix(in srgb, var(--bad) 12%, transparent); color: var(--bad); }
.msg.good { background: color-mix(in srgb, var(--good) 14%, transparent); color: var(--good); }
.codes { font-family: ui-monospace, Menlo, monospace; font-size: 15px; line-height: 1.9;
         columns: 1; background: var(--cream-2); border-radius: 10px; padding: 12px 14px; }
.top { display: flex; justify-content: space-between; align-items: center; }
.pill { font-size: 12px; padding: 3px 8px; border-radius: 999px; background: var(--cream-2); color: var(--mute); }
.ev { font-size: 13px; padding: 6px 0; border-top: 1px solid var(--line); color: var(--cocoa); }
.ev b { color: var(--espresso); font-weight: 600; }
input.check { width: auto; margin: 0 8px 0 0; }
[hidden] { display: none !important; }
@media print { body { background: #fff; color: #000; } .noprint { display: none; } .card { border: 0; } }
