body{font-family:Segoe UI,Arial,sans-serif;margin:2rem;background:#f6f7fb;color:#002868}
h1,h2,h3{color:#002868}
table{border-collapse:collapse;width:100%;margin-bottom:1rem}
th,td{border:1px solid #ddd;padding:.4rem}
.num{text-align:right}
a.tab{margin-right:.5rem;text-decoration:none;color:#002868;padding:.3rem .6rem;border:1px solid transparent;border-radius:4px}
a.tab.active{background:#002868;color:#fff}
.flash{background:#e0ffe3;padding:.4rem;border-radius:4px;width:fit-content}
.error{background:#ffcccc;padding:.4rem;border-radius:4px;width:fit-content}
.center{display:flex;flex-direction:column;align-items:center;margin-top:6rem}
input,select,button{padding:.4rem;margin-top:.2rem}

/* Public header */
.public .page-header {
  text-align: center;
  margin: 0.75rem 0 1rem;
}
.public .page-header h1 {
  margin: .25rem 0 .5rem;
  line-height: 1.2;
}

.public .toolbar { display:flex; justify-content:space-between; align-items:center; margin:.75rem 0 1rem; gap:1rem; }
.public .toolbar .totals { font-weight:700; white-space:nowrap; }
.public .toolbar .selector { margin:0; text-align:right; white-space:nowrap; }

/* “Unofficial results” pill */
.public .note-unofficial {
  display: inline-block;
  margin: 0 auto;
  padding: 6px 10px;
  font-weight: 700;
  letter-spacing: .02em;
  background: #fff4e5;              /* soft warning */
  color: #7a3e00;
  border: 1px solid #f3cf9c;
  border-radius: 8px;
}

/* -------- Public results styling -------- */
body.public { max-width:900px; margin:auto; background:#fff; }
.selector { margin:1rem 0 2rem; }
table.results { border-collapse:collapse; width:100%; margin-bottom:1.5rem; }
table.results td.name { padding:.3rem .5rem; }
table.results td.num  { text-align:right; min-width:4rem; }
table.results td.bar  { width:60%; }
table.results td.bar span{
    display:inline-block; height:1rem; background:#002868;
}

/* ─────────────────────────────────────────────
   Patriotic look & feel  (public results page)
   ─────────────────────────────────────────────*/
body.public{
  max-width:940px; margin:auto;
  background:#fff; border:4px solid #002868;
  box-shadow:0 0 12px rgba(0,0,0,.15);
  padding:1.5rem 2rem;                    /* NEW inner whitespace */
}

.flag-bar{                 /* red / white / blue stripes */
  height:14px;
  background:
    repeating-linear-gradient(
      90deg,
      #B22234  0   20px,    /* red */
      #ffffff 20px 40px,    /* white */
      #3C3B6E 40px 60px,    /* blue */
      #ffffff 60px 80px);   /* white */
}
.gold-line{height:4px;background:#DAA520;}     /* classy gold accent */

h1{
  text-align:center;
  margin:1.4rem 0 2rem;
  font-size:2rem;
  text-shadow:0 1px 0 #DAA520;                 /* subtle gold emboss */
}

.selector{
  text-align:center;
  margin-bottom:2rem;
}
.selector select{
  font-size:1.05rem;
  padding:.3rem .6rem;
  border:2px solid #002868;
  border-radius:4px;
}
.selector label{font-weight:bold;color:#002868}

table.results{
  width:100%; border-collapse:collapse; margin-bottom:1.8rem;
}
table.results td.name{padding:.3rem .5rem;font-weight:bold;white-space:nowrap}
table.results td.num {text-align:right;min-width:5rem;font-weight:bold}
table.results td.bar{width:65%}
table.results td.bar span{
  display:inline-block;height:1.15rem;
  background:linear-gradient(90deg,#3C3B6E 0%,#B22234 100%);
  box-shadow:inset 0 0 2px rgba(0,0,0,.4);
  border-radius:4px;
}

footer{ text-align:center; margin:3rem 0 1rem; color:#666; font-size:.85rem; }
footer a.login-link{ color:#666; text-decoration:none; }
footer a.login-link:hover{ text-decoration:underline; }

/* Login actions */
.form-actions{ display:flex; gap:.6rem; align-items:center; margin-top:.6rem; }
.btn-cancel{
  display:inline-block; padding:.4rem .8rem;
  border:1px solid #bbb; border-radius:4px;
  text-decoration:none; background:#f8f8f8; color:#333;
}
.btn-cancel:hover{ background:#f0f0f0; }