/* mint-site components on top of base.css (shared with the WL site) */
[hidden]{display:none!important}
.nav nav a{white-space:nowrap}

.mint{display:grid;grid-template-columns:1fr 480px;gap:56px;align-items:start;padding-top:40px;padding-bottom:72px}
.mint h1{font-size:clamp(44px,6vw,76px)}

.clock{margin:28px 0;border:2px solid var(--ink);background:var(--ink);color:var(--paper);padding:18px 20px;box-shadow:6px 6px 0 var(--red)}
.clock-label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#c9bfa8}
.clock-digits{font:700 clamp(38px,5vw,56px)/1.1 var(--px);letter-spacing:.04em;margin:6px 0 10px;font-variant-numeric:tabular-nums}
.clock-sched{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:12px;color:#c9bfa8}
.clock-sched span{display:inline-flex;align-items:center;gap:8px}
.k{width:10px;height:10px;display:inline-block}
.k.gold{background:var(--gold)} .k.green{background:#5ad282}

.envelope.mini{transform:rotate(-1.2deg);box-shadow:8px 8px 0 var(--ink)}
.envelope.mini .env-body{min-height:0;grid-template-columns:auto 1fr;grid-template-rows:auto auto;padding:18px;gap:18px;align-items:center}
.envelope.mini .stamp.big{grid-column:1;grid-row:1;width:132px;transform:rotate(-3deg)}
.envelope.mini .env-to{grid-column:2;grid-row:1}
.envelope.mini .env-to strong{font-size:24px}
.envelope.mini .par-avion{grid-column:1/3;grid-row:2}

/* counter */
.counter{border:2px solid var(--ink);background:var(--card);box-shadow:10px 10px 0 var(--ink);position:sticky;top:18px}
.progress{padding:18px 22px;border-bottom:2px dashed var(--line)}
.progress-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:8px}
.progress-row b{font:700 18px var(--px)}
.bar{height:14px;border:2px solid var(--ink);background:#fff;overflow:hidden}
.bar i{display:block;height:100%;width:0;min-width:3px;background:repeating-linear-gradient(-45deg,var(--red) 0 8px,var(--blue) 8px 16px);transition:width .6s}
.elig{display:flex;flex-wrap:wrap;gap:8px;padding:14px 22px 0}
.chip{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border:2px solid var(--line);color:var(--muted);background:#fff}
.chip.on{border-color:var(--blue);background:var(--blue);color:#fff}
.chip.gold{border-color:#c79a1c;background:var(--gold);color:var(--ink)}
.chip.used{text-decoration:line-through}
.rcpt-head{padding:18px 22px 6px}
.rcpt-head h4{font:700 18px var(--px)}
.rcpt-head p{font-size:12px;color:var(--muted)}
.rcpts{padding:0 22px;display:flex;flex-direction:column;gap:10px}
.rcpt{display:grid;grid-template-columns:auto 1fr auto;align-items:center;border:2px solid var(--ink);background:#fff}
.rcpt .no{font:700 13px var(--px);padding:0 10px;color:var(--muted);border-right:2px dashed var(--line);align-self:stretch;display:grid;place-items:center}
.rcpt input{border:0;outline:0;background:transparent;font:500 13px var(--mono);padding:12px 10px;min-width:0;width:100%}
.rcpt .x{border:0;background:none;font:700 16px var(--mono);padding:0 12px;cursor:pointer;color:var(--muted)}
.rcpt .x:hover{color:var(--red)}
.rcpt.ok{border-color:var(--blue);box-shadow:3px 3px 0 var(--blue)}
.rcpt.bad{border-color:var(--red);box-shadow:3px 3px 0 var(--red)}
.rcpt-state{grid-column:1/-1;font-size:11px;padding:4px 10px;border-top:2px dashed var(--line);color:var(--muted)}
.rcpt.ok .rcpt-state{color:var(--blue)} .rcpt.bad .rcpt-state{color:var(--red)}
.link-btn.add{margin:10px 22px 0;text-decoration:none;font-weight:700;color:var(--blue)}
.summary{margin:16px 22px 18px;border-top:2px solid var(--ink);padding-top:12px}
.summary>div{display:flex;justify-content:space-between;font-size:13px;padding:3px 0}
.summary .total{font-size:15px;margin-top:6px;padding-top:8px;border-top:2px dashed var(--line)}
.summary .total b{font:700 22px var(--px)}
.free-note{font-size:12px;color:#8a6a10;background:#fdf0c4;border:2px solid var(--gold);padding:6px 10px;margin-top:10px}
.counter>.btn.wide{margin:0 22px;width:calc(100% - 44px)}
.msg{font-size:13px;min-height:20px;margin:12px 22px 20px;word-break:break-word}
.msg.err{color:var(--red);font-weight:700} .msg.ok{color:var(--blue);font-weight:700}
.msg a{color:inherit}

/* delivered */
.delivered{padding-bottom:40px}
.delivered-card{border:2px solid var(--ink);background:var(--card);box-shadow:10px 10px 0 var(--ink);padding:28px;position:relative}
.delivered-card .stamped{position:absolute;right:26px;top:22px}
.delivered-card h3{font:700 32px var(--px)}
.pairs{display:flex;flex-wrap:wrap;gap:22px;margin:22px 0}
.pair{display:flex;gap:10px;align-items:center;border:2px dashed var(--line);padding:12px}
.pair figure{text-align:center;font-size:12px}
.pair img{width:120px;height:120px;border:2px solid var(--ink);display:block;background:#fff}
.pair .arrow{font:700 24px var(--px);color:var(--red)}

/* stats */
.stats-grid{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:24px;padding-top:80px}
.panel{border:2px solid var(--ink);background:var(--card);box-shadow:6px 6px 0 var(--ink);display:flex;flex-direction:column}
.panel-top{display:flex;justify-content:space-between;gap:10px;padding:10px 16px;background:var(--ink);color:var(--paper);font-size:11px;letter-spacing:.12em}
.kv{padding:6px 16px}
.kv div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:2px dashed var(--line)}
.kv div:last-child{border-bottom:0}
.kv dt{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.kv dd{font:700 16px var(--px);text-align:right}
.kv dd a{text-decoration:none}
.panel>.btn.wide{margin:auto 16px 16px;width:calc(100% - 32px)}
.owed{display:flex;justify-content:space-between;align-items:center;margin:0 16px 12px;padding:10px;border:2px solid var(--gold);background:#fdf0c4;font-size:13px}
.pot{padding:18px 16px 6px}
.pot small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.pot strong{font:700 40px var(--px);color:var(--red)}
.fine.left{text-align:left;padding:0 16px 16px;margin-top:auto}
.feed{list-style:none;padding:6px 16px 14px;max-height:330px;overflow:auto}
.feed li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:2px dashed var(--line);font-size:12px}
.feed li:last-child{border-bottom:0}
.feed .hop{width:26px;height:30px;border:3px solid #fff;outline:2px solid var(--line);display:grid;place-items:center;font:700 11px var(--px)}
.feed a{text-decoration:none}
.feed .t{color:var(--muted)}
.empty{color:var(--muted);font-size:13px;padding:14px 0}
#feedLive{color:#5ad282}

/* gallery */
#pigeons{padding-top:96px}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px}
.tile{border:2px solid var(--ink);background:#fff;padding:8px;box-shadow:4px 4px 0 var(--ink)}
.tile img{width:100%;display:block;aspect-ratio:1;background:var(--paper-2)}
.tile .cap{display:flex;justify-content:space-between;font-size:12px;margin-top:6px}
.tile .cap b{font-family:var(--px)}

@media (max-width:1000px){
  .mint{grid-template-columns:1fr}
  .counter{position:static}
  .envelope.mini{display:none}
  .mint{gap:8px}
  .clock{margin-bottom:28px}
  .stats-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .envelope.mini .stamp.big{width:96px}
  .clock-sched{flex-direction:column}
  .pair img{width:96px;height:96px}
  .delivered-card .stamped{position:static;display:inline-block;margin-bottom:12px}
  .nav .btn.sm{padding:8px 10px;font-size:11px}
}

/* Pixelify's digits blur together at small sizes (2 reads as 8, 5 as S): numbers use the mono face */
.progress-row b,.summary .total b,.summary b,.kv dd,.pot strong,.clock-digits,.stats dd,.tile .cap b,.feed .hop,.envelope.mini .env-to strong{
  font-family:var(--mono);font-weight:700;letter-spacing:-.01em}
.clock-digits{font-size:clamp(34px,4.6vw,50px)}
.pot strong{font-size:34px}

.rcpt-head small{font:500 12px var(--mono);color:var(--muted)}
.qty-pick{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:4px 22px 4px}
.qty-pick button{font:700 14px var(--mono);padding:10px 0;border:2px solid var(--ink);background:#fff;cursor:pointer;color:var(--ink)}
.qty-pick button:hover{background:var(--paper-2)}
.qty-pick button.on{background:var(--ink);color:var(--paper);box-shadow:3px 3px 0 var(--red)}
.qty-pick button:disabled{opacity:.35;cursor:not-allowed}
@media (max-width:560px){.qty-pick{grid-template-columns:repeat(4,1fr)}}