/* The Pot (/pot/): one pot, one clock. Tokens and buttons come from /styles.css; this file is only the page's own pieces. */
.pot{padding-bottom:56px}
.pot__hero{padding-top:28px}
.pot__title{font:800 clamp(38px,7vw,72px)/.98 var(--display);letter-spacing:-.035em;margin:6px 0 10px}
.pot__sub{max-width:56ch;color:var(--ink-2);margin:0 0 22px}
.potbox{border:2px solid var(--ink);border-radius:28px;background:var(--surface);box-shadow:6px 6px 0 var(--hard);padding:clamp(18px,3.4vw,34px);display:flex;flex-direction:column;gap:14px}
.potbox__top{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:end}
.potbox__amt,.potbox__clock{display:flex;flex-direction:column;gap:6px;min-width:0}
.potbox__amt b,.potbox__clock b{font:800 clamp(40px,9.5vw,104px)/.92 var(--display);letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.potbox__amt b{color:var(--yellow)}
:root[data-theme="light"] .potbox__amt b{color:var(--ink);background:linear-gradient(transparent 62%,var(--yellow) 62%);align-self:flex-start;padding:0 .08em}
.potbox__clock{text-align:right;align-items:flex-end}
.potbox__amt span,.potbox__clock span{font:700 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.potbox[data-status="idle"] .potbox__clock b,.potbox[data-status="loading"] .potbox__clock b,.potbox[data-status="off"] .potbox__clock b{color:var(--muted)}
.potbox[data-hot="1"] .potbox__clock b{color:var(--red);animation:pot-beat 1s ease-in-out infinite}
.potbox[data-hot="1"]{border-color:var(--red)}
@keyframes pot-beat{50%{transform:scale(1.035)}}
.potbox__state{margin:0;font-size:17px;line-height:1.45;color:var(--ink)}
.potbox__state b{font-family:var(--mono);font-weight:700}
.potbtn{appearance:none;border:2px solid var(--ink);border-radius:22px;background:var(--yellow);color:#16140F;cursor:pointer;font:800 clamp(22px,4.4vw,34px)/1 var(--display);letter-spacing:-.02em;padding:22px 24px;box-shadow:0 7px 0 var(--hard);transition:transform .08s ease,box-shadow .08s ease;display:flex;flex-wrap:wrap;gap:.2em .5em;justify-content:center;align-items:baseline}
.potbtn small{font:700 .5em/1 var(--mono);letter-spacing:.02em;opacity:.8}
.potbtn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 0 var(--hard)}
.potbtn:active:not(:disabled){transform:translateY(6px);box-shadow:0 1px 0 var(--hard)}
.potbtn:disabled{background:var(--paper-2);color:var(--muted);cursor:not-allowed;box-shadow:0 3px 0 var(--line);border-color:var(--line)}
.potbox__split{margin:0;font:600 13px/1.5 var(--mono);color:var(--ink-2);text-align:center}
.potbox__split b{color:var(--ink)}
.potbox__msg{margin:0;min-height:1.4em;font:600 14px/1.45 var(--mono);color:var(--ink-2);text-align:center}
.potbox__msg.is-bad{color:var(--red)}
.potbox__msg.is-good{color:var(--ink)}
.potbox .rw__wallet{margin-top:2px}
.pot__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.pot-card{border:2px solid var(--ink);border-radius:20px;background:var(--surface);padding:18px;min-width:0}
.pot-card--wide{grid-column:1/-1}
.pot-card__k{margin:0 0 10px;font:700 11.5px/1 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.pot-card__fine{margin:12px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted)}
.pot-feed,.pot-rounds,.pot-how{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.pot-feed li,.pot-rounds li{display:flex;justify-content:space-between;gap:12px;font:600 14px/1.4 var(--mono);color:var(--ink-2);min-width:0}
.pot-feed li b,.pot-rounds li b{color:var(--ink)}
.pot-feed li:first-child:not(.pot-feed__empty){color:var(--ink)}
.pot-feed li:first-child:not(.pot-feed__empty) b::before{content:"👑 "}
.pot-feed li span:last-child,.pot-rounds li span:last-child{color:var(--muted);white-space:nowrap}
.pot-feed__empty{color:var(--muted)!important;font-weight:500!important}
.pot-rounds a{color:var(--ink)}
.pot-how{counter-reset:how;gap:12px}
.pot-how li{counter-increment:how;position:relative;padding-left:34px;font-size:15px;line-height:1.5;color:var(--ink-2)}
.pot-how li::before{content:counter(how);position:absolute;left:0;top:1px;width:24px;height:24px;border-radius:50%;border:2px solid var(--ink);font:800 12px/20px var(--display);text-align:center;color:var(--ink)}
.pot-how b{color:var(--ink)}
@media (max-width:760px){
  .pot__grid{grid-template-columns:1fr}
  .potbox__top{grid-template-columns:1fr;gap:14px}
  .potbox__clock{text-align:left;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.potbox[data-hot="1"] .potbox__clock b{animation:none}}
