/* 蜗牛擂台：贴纸本风格。黑线白纸，橙色是唯一的声音。 */
:root{--paper:#fbfaf4;--ink:#141414;--muted:#6b675e;--hot:#ff5a1f;--good:#1f8a4c;--bad:#c62828;--card:#fff;color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;line-height:1.55;padding:calc(12px + env(safe-area-inset-top,0px)) 14px 40px}
.wrap{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
h1{font-size:clamp(2.6rem,12vw,4rem);line-height:1;margin:.3em 0 0;transform:rotate(-2deg)}
h2{font-size:1.15rem;margin:0 0 6px}
h3{font-size:1rem;margin:14px 0 6px}
.lede{font-size:1.15rem}
.plain{padding-left:1.2em;margin:0}
.plain li{margin:.4em 0}
.top{display:flex;gap:12px;align-items:center}
.top canvas{width:64px;height:64px;flex:none}
.top b{display:block;font-size:1.1rem}
.top span{color:var(--muted);font-size:.85rem}
.btn{font:inherit;background:var(--ink);color:var(--paper);border:0;border-radius:10px 4px 12px 5px;padding:9px 16px;cursor:pointer;text-decoration:none;display:inline-block}
.btn.big{font-size:1.1rem;padding:12px 22px;background:var(--hot);color:var(--ink);border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn.ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px dashed var(--hot);outline-offset:2px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tabs{display:flex;gap:6px;position:sticky;top:0;background:var(--paper);padding:6px 0;z-index:2}
.tabs button{flex:1;font:inherit;padding:8px 4px;background:transparent;border:2px solid var(--ink);border-radius:10px 4px 12px 5px;cursor:pointer}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--paper)}
.card{border:2.5px solid var(--ink);border-radius:16px 6px 18px 8px;background:var(--card);padding:12px 14px}
.card.warn{border-color:var(--bad)}
.kpi{display:flex;gap:14px;flex-wrap:wrap;align-items:baseline}
.kpi .big{font-size:2rem;font-weight:700;line-height:1}
.pos{color:var(--good)}.neg{color:var(--bad)}
.note{color:var(--muted);font-size:.85rem;margin:.4em 0}
.err{color:var(--bad)}
textarea{width:100%;min-height:84px;font:inherit;padding:10px;border:2.5px solid var(--ink);border-radius:10px;background:#fff;resize:vertical}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font:inherit;font-size:.82rem;padding:4px 10px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;cursor:pointer}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th,td{padding:5px 4px;border-bottom:1px dashed #bbb;text-align:left}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.feed{list-style:none;margin:0;padding:0}
.feed li{padding:6px 0;border-bottom:1px dashed #bbb;font-size:.9rem}
.feed time{color:var(--muted);font-size:.78rem;margin-right:6px}
.tag{font-size:.72rem;border:1.5px solid var(--ink);border-radius:999px;padding:0 6px;margin-left:6px;vertical-align:middle}
.egg{width:min(240px,70vw);height:auto;aspect-ratio:1;touch-action:none;align-self:center}
.value{border:2px dashed var(--ink);border-radius:10px;padding:8px 10px;margin:8px 0}
.value p{margin:.2em 0 .5em;font-size:.85rem}
.value table{font-size:.88rem}
.legal{color:var(--muted);font-size:.78rem;margin-top:10px}
.landing .wrap{padding-top:24px}
[hidden]{display:none!important}
