/* Guild Manager — Prototype 1. "Modern MUD": text-forward, dark, quick to read. */
:root{
  --bg:#14110e; --panel:#1e1a15; --panel2:#262019; --ink:#e8ddc7; --dim:#a7987c;
  --line:#3a3225; --gold:#d8b060; --green:#8fbf7f; --red:#d97a6c; --blue:#7fa8c9;
  --violet:#b79bd0;
  --radius:7px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:14px/1.5 "Iosevka","Cascadia Code",ui-monospace,Menlo,Consolas,monospace}
h1,h2,h3{font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  color:var(--gold);margin:.2em 0 .4em;font-weight:600;letter-spacing:.02em}
h1{font-size:1.35rem} h2{font-size:1.1rem} h3{font-size:.98rem}
a{color:var(--blue)}
button{font:inherit;background:var(--panel2);color:var(--ink);border:1px solid var(--line);
  border-radius:var(--radius);padding:.35em .7em;cursor:pointer}
button:hover{border-color:var(--gold);color:#fff}
button:disabled{opacity:.4;cursor:not-allowed}
button.primary{background:#3a2f18;border-color:var(--gold);color:var(--gold)}
input,select{font:inherit;background:#0f0d0a;color:var(--ink);border:1px solid var(--line);
  border-radius:var(--radius);padding:.35em .5em}
.wrap{max-width:1180px;margin:0 auto;padding:0 14px 60px}
header.top{display:flex;flex-wrap:wrap;gap:14px;align-items:baseline;
  border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:14px}
header.top .stat{color:var(--dim)} header.top .stat b{color:var(--ink)}
nav.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
nav.tabs button{border-radius:20px;padding:.3em .9em}
nav.tabs button.active{background:#3a2f18;border-color:var(--gold);color:var(--gold)}
.grid{display:grid;gap:12px}
.cols-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.cols-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px}
.card.tight{padding:9px 11px}
.muted{color:var(--dim)}
.tag{display:inline-block;font-size:.74rem;background:#0f0d0a;border:1px solid var(--line);
  border-radius:12px;padding:.05em .55em;margin:.1em .2em .1em 0;color:var(--dim)}
.tag.ward{color:var(--blue);border-color:#2f4658}
.tier{font-size:.72rem;padding:.05em .5em;border-radius:10px;border:1px solid var(--line)}
.tier.t0{color:#cfc3a6} .tier.t1{color:var(--green)} .tier.t2{color:var(--blue)}
.tier.t3{color:var(--violet)} .tier.t4{color:var(--gold);border-color:var(--gold)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.pill{font-size:.75rem;border:1px solid var(--line);border-radius:12px;padding:.1em .6em}
.grade-Triumph{color:var(--gold)} .grade-Success{color:var(--green)}
.grade-Partial{color:#d7c98c} .grade-Failure{color:var(--red)} .grade-Disaster{color:var(--red)}
.odds-Favoured{color:var(--green)} .odds-Even{color:#d7c98c}
.odds-Risky{color:var(--red)} .odds-Forlorn{color:var(--red)}
.bar{height:12px;background:#0f0d0a;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.bar > i{display:block;height:100%;background:linear-gradient(90deg,#6a5320,var(--gold))}
.log{max-height:380px;overflow:auto;font-size:.85rem}
.log .e{border-bottom:1px dashed var(--line);padding:.4em 0}
.log .e .k{color:var(--dim);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}
table{width:100%;border-collapse:collapse;font-size:.86rem}
th,td{text-align:left;padding:.35em .5em;border-bottom:1px solid var(--line)}
th{color:var(--dim);font-weight:400}
.hero{border:1px solid var(--line);border-radius:var(--radius);padding:9px;background:var(--panel2)}
.hero.sel{border-color:var(--gold)}
.hero .nm{color:var(--ink)} .hero .meta{color:var(--dim);font-size:.8rem}
.founder{color:var(--gold)}
.flash{position:fixed;right:14px;bottom:14px;max-width:360px;display:flex;flex-direction:column;gap:8px;z-index:50}
.flash div{background:var(--panel2);border:1px solid var(--gold);border-radius:var(--radius);
  padding:.6em .8em;box-shadow:0 6px 24px #0008}
.flash div.err{border-color:var(--red);color:var(--red)}
.center{min-height:70vh;display:flex;align-items:center;justify-content:center}
.login{max-width:380px;width:100%}
.login .card{padding:20px}
.login input{width:100%;margin:.3em 0 .7em}
.small{font-size:.8rem}
hr{border:0;border-top:1px solid var(--line);margin:10px 0}
.kbd{font-size:.75rem;background:#0f0d0a;border:1px solid var(--line);border-radius:4px;padding:0 .3em}

/* Day 2 additions --------------------------------------------------------- */
.stepper{display:inline-flex;align-items:stretch;border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden}
.stepper button{border:0;border-radius:0;padding:.25em .6em}
.stepper input{border:0;border-radius:0;width:52px;text-align:center;
  border-left:1px solid var(--line);border-right:1px solid var(--line)}
.search{width:100%;margin-bottom:8px}
.strip{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}
.strip > .hero{min-width:210px;flex:0 0 auto;scroll-snap-align:start}
details.venture summary{cursor:pointer;list-style:none}
details.venture summary::-webkit-details-marker{display:none}
details.venture summary .chev::after{content:"▸";display:inline-block;margin-left:.3em;color:var(--dim)}
details.venture[open] summary .chev::after{content:"▾"}
.workshop-cols{display:grid;grid-template-columns:260px 1fr;gap:14px}
@media (max-width:820px){.workshop-cols{grid-template-columns:1fr}}
.compact-kv{max-height:420px;overflow:auto}
.compact-kv .row-kv{display:flex;justify-content:space-between;font-size:.82rem;
  padding:.15em 0;border-bottom:1px dashed var(--line)}
.armory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.armory-item{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel2);
  padding:.5em .7em;font-size:.85rem}
.bench{border:1px dashed var(--line);border-radius:var(--radius);padding:8px;margin-bottom:8px}
.bench.filled{border-style:solid;border-color:var(--gold)}
.locked{opacity:.55}
.panel{scroll-margin-top:8px}

/* Day 3 additions --------------------------------------------------------- */
.layout{display:flex;gap:16px;align-items:flex-start}
.layout main{flex:1;min-width:0}
aside#sidebar{width:250px;flex-shrink:0;position:sticky;top:8px;display:flex;
  flex-direction:column;gap:10px}
@media (max-width:900px){.layout{flex-direction:column}aside#sidebar{width:100%;position:static}}
aside#sidebar .card{padding:9px 10px}
aside#sidebar h3{font-size:.85rem;margin:0 0 .4em}
.side-row{font-size:.78rem;border-bottom:1px dashed var(--line);padding:.3em 0}
.side-row:last-child{border-bottom:0}
.campaign-stat{display:flex;align-items:center;gap:8px}
.camp-bar{width:110px}
.venture-line{display:flex;justify-content:space-between;gap:10px;align-items:baseline;
  flex-wrap:wrap}
.recruit-nav{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px}
.recruit-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.status-badge{font-size:.7rem;border-radius:10px;padding:.05em .5em;border:1px solid var(--line)}
.status-Free-Agent{color:var(--green);border-color:var(--green)}
.status-Taken{color:var(--dim)}
.status-On-Loan{color:var(--blue);border-color:var(--blue)}
.status-Available-for-Hire{color:var(--gold);border-color:var(--gold)}
.facility-row{border:1px solid var(--line);border-radius:var(--radius);padding:8px;margin-bottom:8px}
.facility-row.filled{border-color:var(--gold)}
.rank-you{color:var(--gold);font-weight:600}

/* Day 4 additions --------------------------------------------------------- */
/* Canonical Window timer: a notable display face, in a deep earthen red, gently pulsing. */
.window-timer{
  font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  font-weight:700;font-size:.95rem;letter-spacing:.04em;
  color:#c9553f;margin:.15em 0 .1em;
  animation:windowPulse 1.15s ease-in-out infinite;
}
@keyframes windowPulse{0%,100%{opacity:1}50%{opacity:.42}}

/* "something just went up" — a soft golden-brown pulse on a bar element or a numeral.
   Uses filter so it works on both the gradient bar fill and plain text. */
.flash-gain{animation:flashGain 1s ease-out 1}
@keyframes flashGain{
  0%{filter:brightness(1.75) saturate(1.4);
     text-shadow:0 0 10px rgba(184,144,80,.85)}
  100%{filter:none;text-shadow:none}
}

/* Sidebar: a brand-new row flickers its text three times, then settles. */
.flicker-in{animation:flickerIn 1.5s ease-in-out 1}
@keyframes flickerIn{
  0%,32%,64%{background:rgba(216,176,96,.30);color:#f3e6c6}
  16%,48%,80%{background:transparent;color:inherit}
  100%{background:transparent;color:inherit}
}

/* Workshop Queue — fixed height, scrolls internally (panel card and sidebar card alike).
   Right padding keeps the scrollbar off the text; the gap spaces the rows. */
.queue-scroll{max-height:168px;overflow-y:auto;padding-right:12px;display:flex;
  flex-direction:column;gap:4px}
.queue-scroll > *{padding-right:2px}

/* Muster: a community tier struck through once it has been crossed and paid out. */
.tier-reached td{text-decoration:line-through;opacity:.55}

/* Board slots — a fixed shape so cards don't jump as lines/countdowns change. */
.board-slot{display:flex;flex-direction:column;min-height:250px}
.board-slot.job-slot{min-height:220px}
.board-slot > .spread{margin-bottom:2px}
.timer-slot{min-height:1.35em;line-height:1.35em;font-variant-numeric:tabular-nums}
.timer-slot.window-timer{min-height:1.4em;margin:.1em 0}
.slot-meta{display:flex;flex-direction:column;gap:2px}
.slot-meta .slot-flavor{margin-top:2px}
.slot-foot{margin-top:auto;padding-top:8px;min-height:2.4em;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.slot-foot.row{align-items:center}
.slot-detail{margin-top:6px;border-top:1px dashed var(--line);padding-top:6px}

/* Hall — Guild Storage recent list: fixed columns so the live "… ago" clock,
   which changes width every second, never nudges the name/bucket columns. */
.hall-store{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.hall-store-row{display:grid;grid-template-columns:1fr 4.5em 6.5em;gap:8px;align-items:baseline}
.hsr-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hsr-bucket{white-space:nowrap}
.hsr-age{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}