:root{--red:#B3121B;--red2:#8E0C14;--gold:#F5C542;--gold2:#FFE08A;--ink:#FFF4E0;--dim:#F3B7B7;--black:#1A0507;--ok:#7CFFB2;
  --disp:'ZCOOL KuaiLe','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;--body:'Noto Sans SC','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;--px:'Press Start 2P','Courier New',monospace}
*{box-sizing:border-box}
html,body{margin:0;background:var(--red);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
body{background-image:repeating-linear-gradient(0deg,transparent 0 6px,rgba(0,0,0,.06) 6px 8px)}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
[hidden]{display:none!important}
.k{font-family:var(--body);font-size:12px;letter-spacing:.2em;color:var(--dim)}
.px{font-family:var(--px)}

/* bar */
.bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;height:60px;background:var(--red2);border-bottom:4px solid var(--gold);image-rendering:pixelated}
.mark{font-family:var(--disp);font-size:30px;color:var(--gold);text-decoration:none;text-shadow:3px 3px 0 var(--black)}
.right{display:flex;align-items:center;gap:10px}
#social a{font-size:13px;color:var(--gold2);text-decoration:none;margin-right:10px}
#walletBtn{font-family:var(--body);font-weight:700;font-size:13px;padding:8px 14px;border:3px solid var(--gold);color:var(--gold);box-shadow:3px 3px 0 var(--black);white-space:nowrap}
#walletBtn.on{background:var(--gold);color:var(--black)}

/* the single object */
.stage{max-width:640px;margin:0 auto;padding:22px 16px 40px}
.thesis{margin:0 0 6px;font-family:var(--disp);font-size:clamp(32px,8.6vw,60px);line-height:1.05;color:var(--gold);text-shadow:4px 4px 0 var(--black);text-align:center}
.sub{margin:0 0 18px;text-align:center;font-size:15px;color:var(--ink);opacity:.92}
.block{position:relative;background:var(--black);border:4px solid var(--gold);box-shadow:8px 8px 0 var(--red2);padding:18px 16px 16px;overflow:hidden}
.block .lbl{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--gold2);letter-spacing:.15em}
.clock{font-family:var(--px);font-size:clamp(46px,14vw,88px);line-height:1;color:var(--gold);text-align:center;margin:14px 0 8px;font-variant-numeric:tabular-nums;text-shadow:4px 4px 0 var(--red2)}
.block.idle .clock{color:#7a5a2a;text-shadow:none}
.block.sold .clock{color:var(--ink)}
.clock.urgent{animation:pulse .5s steps(2,end) infinite}
@keyframes pulse{50%{opacity:.35}}
.reset{position:absolute;right:14px;top:12px;font-family:var(--px);font-size:16px;color:var(--ok);opacity:0;pointer-events:none}
.reset.go{animation:up 1.2s ease-out forwards}
@keyframes up{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-30px)}}
.stamp{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0}
.stamp span{font-family:var(--disp);font-size:clamp(48px,16vw,110px);color:var(--black);background:var(--gold);padding:0 .3em;line-height:1.1;transform:rotate(-6deg);box-shadow:6px 6px 0 var(--red2)}
.stamp.go{animation:slam .6s cubic-bezier(.2,1.6,.4,1) forwards}
@keyframes slam{0%{opacity:0;transform:scale(2.4)}70%{opacity:1;transform:scale(.96)}100%{opacity:1;transform:scale(1)}}
.block.sold .stamp{opacity:1}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.stat{background:var(--red2);border:2px solid var(--gold);padding:8px 10px;min-width:0}
.stat .k{font-size:11px;color:var(--gold2)}
.stat .v{font-family:var(--px);font-size:clamp(13px,3.6vw,18px);margin-top:6px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat .s{font-size:11px;color:var(--dim);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat .v a{text-decoration:none}

/* the button */
.paddle{margin:14px 0 8px}
.bidBtn{width:100%;font-family:var(--disp);font-size:clamp(28px,8vw,46px);line-height:1;padding:18px 16px;border:4px solid var(--black);background:var(--gold);color:var(--black);box-shadow:8px 8px 0 var(--black);display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.bidBtn small{font-family:var(--px);font-size:12px}
.bidBtn:active{transform:translate(4px,4px);box-shadow:4px 4px 0 var(--black)}
.bidBtn:disabled{background:#5a3a2a;color:#c9a37a;cursor:not-allowed;box-shadow:none}
.bidBtn.ghost{background:var(--black);color:var(--gold);border-color:var(--gold)}
.status{font-size:13px;min-height:18px;margin-top:8px;color:var(--ink)}
.status a{color:var(--gold)}
.example{font-size:14px;margin-top:8px;padding:10px 12px;background:rgba(0,0,0,.25);border-left:4px solid var(--gold)}
.example b{font-family:var(--px);font-size:12px}

.steps{display:grid;grid-template-columns:1fr;gap:8px;margin:16px 0}
.step{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:start;background:var(--black);border:2px solid var(--gold);padding:10px 12px}
.step .n{font-family:var(--px);font-size:22px;color:var(--gold)}
.step h3{margin:0 0 2px;font-family:var(--disp);font-weight:400;font-size:20px;color:var(--gold2)}
.step p{margin:0;font-size:13px;color:var(--ink);opacity:.85}

section h2.h{margin:22px 0 8px;font-family:var(--disp);font-weight:400;font-size:26px;color:var(--gold);text-shadow:3px 3px 0 var(--black);display:flex;justify-content:space-between;align-items:baseline;gap:8px}
section h2.h .k{font-size:11px}
.log{background:var(--black);border:3px solid var(--gold);max-height:52vh;overflow:auto;font-size:13px}
.line{display:grid;grid-template-columns:48px 1fr auto;gap:8px;padding:8px 10px;border-bottom:1px solid #3a1214;align-items:baseline}
.line .t{color:var(--dim);font-size:11px;font-family:var(--px);font-size:9px}
.line .m{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.line .r{color:var(--dim);font-size:11px}
.line.bid .m b{color:var(--gold)}
.line.sold{background:#2a0a0d}
.line.sold .m b{color:var(--ok)}
.line.paddle .m{color:var(--dim)}
.line.fresh{animation:flash 1.4s ease-out}
@keyframes flash{0%{background:rgba(245,197,66,.35)}100%{background:transparent}}
.empty{padding:18px 12px;color:var(--dim);font-size:13px}
table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed;background:var(--black);border:3px solid var(--gold)}
th{text-align:left;font-weight:400;color:var(--gold2);font-size:11px;padding:8px 10px;border-bottom:2px solid var(--gold)}
td{padding:8px 10px;border-bottom:1px solid #3a1214;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
td a{text-decoration:none}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;font-size:13px;align-items:baseline;background:var(--black);border:3px solid var(--gold);padding:12px}
.kv .v{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kv .v.big{font-family:var(--px);font-size:18px;color:var(--gold)}
.ca{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 10px}
.ca code{font-family:var(--px);font-size:9px;line-height:1.6;padding:8px 10px;border:2px solid var(--gold);background:var(--black);word-break:break-all;flex:1;min-width:200px;white-space:normal}
.btn{font-family:var(--body);font-weight:700;font-size:13px;padding:9px 14px;border:3px solid var(--gold);color:var(--gold);text-decoration:none;display:inline-block;box-shadow:3px 3px 0 var(--black);background:var(--black)}
.btn.gold{background:var(--gold);color:var(--black);border-color:var(--black)}
.btn.sm{padding:6px 10px;font-size:12px}
.btn:disabled{opacity:.4;cursor:not-allowed}
.rules{margin:10px 0 0;padding:0;list-style:none;font-size:13px}
.rules li{padding:7px 0;border-top:1px dashed var(--gold)}
.foot{margin-top:24px;padding-top:14px;border-top:4px solid var(--gold);font-size:12px;color:var(--dim);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.foot a{color:var(--gold2)}

/* subpages */
.page{max-width:640px;margin:0 auto;padding:26px 16px 60px}
.page h1{font-family:var(--disp);font-weight:400;font-size:clamp(34px,9vw,60px);line-height:1.05;margin:0 0 10px;color:var(--gold);text-shadow:4px 4px 0 var(--black)}
.page .huge{font-family:var(--px);font-size:clamp(22px,7vw,40px);color:var(--gold);margin:6px 0 14px}
.page .lead{font-size:15px;margin:0 0 16px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

/* modal + toast */
#modal{position:fixed;inset:0;background:rgba(0,0,0,.72);display:grid;place-items:center;z-index:20}
.sheet{background:var(--black);border:4px solid var(--gold);width:min(420px,92vw);padding:14px;box-shadow:8px 8px 0 var(--red2)}
.sheetHead{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--gold2);margin-bottom:10px}
.sheetHead button{font-size:22px;color:var(--gold)}
.wopt{display:flex;align-items:center;gap:10px;width:100%;padding:12px;border:2px solid var(--gold);margin-bottom:6px;text-align:left;font-size:14px}
.wopt img{width:22px;height:22px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--gold);color:var(--black);font-weight:700;font-size:13px;padding:10px 14px;z-index:30;max-width:92vw;box-shadow:4px 4px 0 var(--black)}
@media (prefers-reduced-motion:reduce){.clock.urgent,.reset.go,.stamp.go,.line.fresh{animation:none}}