/* Advent of Pwn — dark terminal / advent aesthetic. */
:root{
  --bg:#0a0e14; --panel:#0f1620; --ink:#cfe3d0; --dim:#6b7d7e;
  --green:#39d353; --gold:#ffd447; --red:#ff5c6c; --line:#1d2a33;
  --mono:"SFMono-Regular",ui-monospace,"JetBrains Mono",Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--mono);line-height:1.5;font-size:15px;padding-bottom:6rem}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none}
header.bar,main,footer{position:relative;z-index:1}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline}

header.bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.8rem 1.2rem;border-bottom:1px solid var(--line);flex-wrap:wrap;
  height:auto;min-height:0;overflow:visible;line-height:1.5}
.brand{color:var(--gold);font-weight:700;letter-spacing:.5px}
header nav{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.who{color:var(--dim)} .who b{color:var(--gold)}
.inline{display:inline-flex;gap:.4rem;margin:0}
input{background:#0b1118;border:1px solid var(--line);color:var(--ink);
  padding:.35rem .5rem;border-radius:4px;font-family:var(--mono)}
button{background:var(--green);color:#071a0c;border:0;padding:.35rem .7rem;
  border-radius:4px;font-family:var(--mono);font-weight:700;cursor:pointer}
button:hover{filter:brightness(1.1)} button:disabled{background:var(--dim);cursor:not-allowed}
button.link{background:none;color:var(--dim);padding:0;font-weight:400}
button.link:hover{color:var(--red)}

main{max-width:960px;margin:0 auto;padding:1.6rem 1.2rem 3rem}
.headline{color:var(--gold);font-size:1.6rem;margin:.2rem 0}
.sub{color:var(--dim);margin:.2rem 0 1.4rem}
.ssh-line{color:var(--dim);margin:.1rem 0 1.4rem;font-size:.9rem}
.ssh-line code{background:#060a0f;border:1px solid var(--line);padding:.15rem .5rem;border-radius:4px;color:var(--green)}
.back{color:var(--dim)}

/* hero: fill the viewport and vertically center the headline + calendar.
   (header bar ≈ 60px + main's vertical padding ≈ 80px → subtract ~140px) */
.hero{min-height:calc(100vh - 140px);display:flex;flex-direction:column;justify-content:center}

/* calendar — a real December wall-calendar grid (Sunday-first, 7 columns) */
.cal-scroll{overflow-x:auto;margin-top:2rem;margin-bottom:0}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(100px,124px));gap:.6rem;
  justify-content:center;min-width:744px}
.cal-head{color:var(--dim);font-size:.78rem;text-align:center;padding:.2rem 0;
  border-bottom:1px solid var(--line);letter-spacing:.5px}
.cal-cell{min-height:98px;border-radius:8px}
.cal-cell.blank{border:0;background:transparent}
.cal-cell.off{border:1px dashed var(--line);background:transparent;opacity:.4;
  display:flex;align-items:flex-start;justify-content:flex-end;padding:.4rem .5rem}
.cal-cell.off .num{font-size:.9rem;color:var(--dim)}

.door{position:relative;display:flex;flex-direction:column;gap:.15rem;
  padding:.6rem;border:1px solid var(--line);border-radius:8px;
  background:var(--panel);color:var(--ink);overflow:hidden}
.door .num{font-size:1.25rem;font-weight:700;color:var(--gold)}
.door .ttl{font-size:.78rem} .door .meta{font-size:.68rem;color:var(--dim);margin-top:auto}
.door .star{position:absolute;top:.45rem;right:.55rem;color:var(--dim)}
.door.open:hover{border-color:var(--green);box-shadow:0 0 0 1px var(--green) inset}
.door.open.solved{border-color:var(--green)}
.door.open.solved .star{color:var(--gold)}
.door.soon{opacity:.75}.door.soon .ttl{color:var(--dim)}
.door.locked{opacity:.5;align-items:center;justify-content:center}
.door.locked .num{color:var(--dim)} .door.locked .lock{font-size:1.05rem}

/* FAQ (below the calendar) */
.faq{margin-top:2rem;border-top:1px solid var(--line);padding-top:1.5rem;scroll-margin-top:1rem}
.faq h2{color:var(--gold);font-size:1.15rem;margin:0 0 1rem}
.faq-item{background:var(--panel);border:1px solid var(--line);border-radius:8px;
  padding:.7rem 1rem;margin:.5rem 0}
.faq-item summary{cursor:pointer;color:var(--green);font-weight:700;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:"▸ ";color:var(--dim)}
.faq-item[open] summary::before{content:"▾ "}
.faq-item p{color:var(--ink);margin:.6rem 0 .2rem;line-height:1.6}
.faq-item code{color:var(--gold)}

/* pinned rotating sponsor box (bottom-right, every page) */
.sponsor-box{position:fixed;right:1rem;bottom:1rem;width:340px;z-index:3;
  background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:1rem 1.1rem;font-size:.9rem}
.sponsor-box-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.35rem}
.sponsor-box-label{color:var(--dim);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase}
.sb-all{color:var(--dim);font-size:.68rem}
.sponsor-slide img{max-width:100%;max-height:52px;object-fit:contain;display:block;margin-bottom:.45rem}
.sb-name{color:var(--gold);font-weight:700;font-size:1rem}
.sb-blurb{color:var(--ink);line-height:1.5;margin:.3rem 0;max-height:7.5em;overflow:hidden}
.sb-links{margin-top:.25rem}
.sb-links a{color:var(--green)}
.sb-links .sep{color:var(--dim)}
@media(max-width:620px){.sponsor-box{display:none}}

/* sponsors */
.sponsors{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.sponsor{display:flex;gap:1rem;align-items:flex-start;background:var(--panel);
  border:1px solid var(--line);border-radius:8px;padding:1rem}
.sponsor-logo{width:84px;height:84px;object-fit:contain;border-radius:6px;
  background:#0b1118;flex:0 0 auto}
.sponsor-body h2{margin:0 0 .3rem;color:var(--gold);font-size:1.05rem}
.sponsor-blurb{margin:.2rem 0 .5rem;color:var(--ink);line-height:1.6}
.sponsor-links a{color:var(--green)}
.sponsor-links .sep{color:var(--dim)}

/* ops dashboard */
.dim{color:var(--dim)}
.ops-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:1rem 0}
@media(max-width:620px){.ops-tiles{grid-template-columns:repeat(2,1fr)}}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:.8rem}
.tile-label{color:var(--dim);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.tile-val{color:var(--gold);font-size:1.25rem;font-weight:700;margin:.25rem 0}
.tile-sub{color:var(--dim);font-size:.72rem}
.meter{height:6px;background:#0b1118;border-radius:3px;overflow:hidden;margin-top:.4rem}
.meter>div{height:100%;background:var(--green);width:0;transition:width .4s}
td.ok{color:var(--green)} td.warn{color:var(--red)}

/* day page */
.tags,.mits{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0 1rem}
.tag{font-size:.78rem;color:var(--dim);border:1px solid var(--line);padding:.15rem .5rem;border-radius:999px}
.story{background:var(--panel);padding:.8rem 1rem;border-radius:4px}
.lesson-art{margin:0;white-space:pre;overflow-x:auto;color:var(--ink);
  font-family:var(--mono);font-size:13px;line-height:1.5;tab-size:2}
.lesson h2{color:var(--gold)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
@media(max-width:620px){.cols{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:1rem;margin-top:1rem}
.panel h2{margin:.1rem 0 .6rem;font-size:1rem;color:var(--green)}
pre.cmd{background:#060a0f;border:1px solid var(--line);padding:.6rem .8rem;border-radius:4px;overflow:auto}
code{color:var(--gold)}
.files{list-style:none;padding:0;margin:0}.files li{margin:.3rem 0}
.mit{font-size:.78rem;padding:.15rem .5rem;border-radius:4px;border:1px solid var(--line)}
.mit.on{color:var(--red);border-color:var(--red)} .mit.off{color:var(--green);border-color:var(--green)}
.hint{margin:.4rem 0}.hint summary{cursor:pointer;color:var(--gold)}
.note{color:var(--dim);font-size:.85rem}.note.ok{color:var(--green)}.note.warn{color:var(--red)}
.submit form{display:flex;gap:.5rem}.submit input{flex:1}
form.stack{display:flex;flex-direction:column;gap:.6rem;max-width:320px}
form.stack input:not([type=checkbox]){width:100%}
form.stack button{align-self:flex-start}
.check{display:flex;gap:.5rem;align-items:flex-start;color:var(--ink);font-size:.85rem;line-height:1.4;cursor:pointer}
.check input[type=checkbox]{width:auto;margin-top:.15rem;flex:0 0 auto}
.check span{flex:1}
#career-fields{display:flex;flex-direction:column;gap:.6rem}
#career-fields[hidden]{display:none}

/* scoreboard */
.board{width:100%;border-collapse:collapse;margin-top:1rem}
.board th,.board td{text-align:left;padding:.5rem .6rem;border-bottom:1px solid var(--line)}
.board th{color:var(--dim);font-weight:400;font-size:.8rem}
.board .rank{color:var(--gold)} .board .score{color:var(--gold);font-weight:700}
.board tr.me{background:rgba(57,211,83,.08)}
.pill{display:inline-block;font-size:.7rem;color:var(--dim);border:1px solid var(--line);
  border-radius:4px;padding:.05rem .35rem;margin:.1rem}
footer{max-width:960px;margin:0 auto;padding:1rem 1.2rem;color:var(--dim);font-size:.8rem;border-top:1px solid var(--line)}
#xmas{position:fixed;left:0;right:0;bottom:0;z-index:0;pointer-events:none;overflow:hidden}
#xmas .trees{margin:0;font-family:var(--mono);font-size:14px;line-height:1.05;
  color:var(--green);white-space:pre;opacity:.9}
#xmas .trees .star{color:var(--gold)}
#xmas #snow{position:absolute;inset:0}