[hidden]{display:none!important;}
:root{--ok:#3a3;--err:#d44;}
:root:not([data-theme=light]){--bg:#161616;--fg:#ddd;--dim:#888;--line:#333;--acc:#f2b8e2;--ok:#6c6;--err:#f66;}
html,body{transition:background .2s,color .2s;}
.p{max-width:880px;margin:3rem auto 4rem;padding:0 max(1rem,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(1rem,env(safe-area-inset-left));}
#theme{position:fixed;top:calc(.6rem + env(safe-area-inset-top));right:.7rem;border:none;background:none;padding:.3rem;line-height:0;color:var(--dim);opacity:.25;cursor:pointer;transition:opacity .2s,color .2s;}
#theme:hover{opacity:1;color:var(--acc);}
button,select.f,input.f{font:inherit;font-size:.9rem;height:2.1rem;padding:0 .8rem;background:var(--bg);color:var(--fg);border:1px solid var(--line);outline:none;}
button{cursor:pointer;transition:border-color .15s,color .15s;}
button:hover,button.on{border-color:var(--acc);color:var(--acc);}
input.f:focus,select.f:focus{border-color:var(--acc);}
a{color:inherit;}
.seg{display:inline-flex;margin-bottom:1rem;}
.seg button+button{margin-left:-1px;}
.seg button:hover,.seg button.on{position:relative;z-index:1;}
.seg.sm{margin:0;}
.seg.sm button{height:1.7rem;font-size:.8rem;padding:0 .6rem;}
#card{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;}
#card img{width:64px;height:64px;image-rendering:pixelated;background:var(--line);}
#card .t{flex:1;min-width:0;}
#card h1{margin:0;padding:0;border:none;font-size:1.6rem;font-weight:normal;line-height:1.2;display:flex;align-items:center;gap:.5rem;}
#card small{display:block;color:var(--dim);font-size:.85rem;margin-top:.2rem;}
.dot{width:.5em;height:.5em;border-radius:50%;background:var(--dim);flex-shrink:0;}
.dot.on{background:var(--ok);}
#addr{font-family:var(--mono,monospace);font-size:.85rem;}
.sec{display:flex;align-items:center;gap:.6rem;margin:2.2rem 0 .8rem;border-bottom:1px solid var(--line);padding-bottom:.45rem;min-height:2.6rem;}
.sec h2{flex:1;margin:0;padding:0;border:none;}
.sec .d{color:var(--dim);font-size:.85rem;}
.sec input.f{width:9rem;}
.empty{color:var(--dim);font-size:.9rem;}
.heads{display:flex;flex-wrap:wrap;gap:.6rem;}
.heads a{display:flex;align-items:center;gap:.45rem;text-decoration:none;border:1px solid var(--line);padding:.3rem .6rem .3rem .3rem;cursor:pointer;}
.heads a:hover{border-color:var(--acc);}
img.h{width:24px;height:24px;image-rendering:pixelated;background:var(--line);display:block;flex-shrink:0;}
.records{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.6rem;}
.records a{border:1px solid var(--line);padding:.7rem .8rem;text-decoration:none;cursor:pointer;display:flex;flex-direction:column;gap:.45rem;transition:border-color .15s;}
.records a:hover{border-color:var(--acc);}
.records span{font-size:.8rem;color:var(--dim);}
.records b{font-weight:normal;font-size:1.35rem;line-height:1.1;}
.records div{display:flex;align-items:center;gap:.45rem;font-size:.9rem;}
.board a{display:grid;grid-template-columns:1.6rem 24px 1fr auto;align-items:center;gap:.6rem;padding:.4rem 0;border-top:1px solid var(--line);text-decoration:none;cursor:pointer;position:relative;}
.board a:first-child{border-top:none;}
.board a:hover .nm{color:var(--acc);}
.board .r{color:var(--dim);font-size:.85rem;text-align:right;}
.board .v{font-size:.9rem;color:var(--dim);}
.board i{position:absolute;left:0;bottom:-1px;height:2px;background:var(--acc);opacity:.5;}
.board a:first-child i{bottom:0;}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem;}
.grid a{display:flex;align-items:center;gap:.55rem;border:1px solid var(--line);padding:.45rem .6rem;text-decoration:none;cursor:pointer;min-width:0;}
.grid a:hover{border-color:var(--acc);}
.grid .n{min-width:0;flex:1;line-height:1.25;}
.grid .n span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.grid small{display:block;color:var(--dim);font-size:.75rem;}
.graph svg{width:100%;height:110px;display:block;border:1px solid var(--line);}
.graph path.l{fill:none;stroke:var(--acc);stroke-width:1.5;vector-effect:non-scaling-stroke;}
.graph path.a{fill:var(--acc);opacity:.12;}
.graph .ax{display:flex;justify-content:space-between;font-size:.75rem;color:var(--dim);margin-top:.3rem;}
.back{display:inline-block;color:var(--dim);font-size:.9rem;text-decoration:none;margin-bottom:1.4rem;cursor:pointer;}
.back:hover{color:var(--acc);}
.ph{display:flex;align-items:flex-end;gap:1.2rem;margin-bottom:1.4rem;}
.ph img{width:84px;height:auto;image-rendering:pixelated;}
.ph h1{margin:0;padding:0;border:none;font-size:1.8rem;font-weight:normal;line-height:1.1;display:flex;align-items:center;gap:.5rem;}
.ph small{display:block;color:var(--dim);font-size:.9rem;margin-top:.3rem;}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;}
.kv div{border:1px solid var(--line);padding:.5rem .7rem;}
.kv span{display:block;font-size:.75rem;color:var(--dim);margin-bottom:.1rem;}
.bars div{display:grid;grid-template-columns:7rem 1fr 5rem;align-items:center;gap:.6rem;font-size:.9rem;padding:.25rem 0;}
.bars i{display:block;height:.45rem;background:var(--acc);opacity:.7;}
.bars em{font-style:normal;color:var(--dim);text-align:right;font-size:.85rem;}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 1.6rem;}
.list div{display:flex;justify-content:space-between;gap:.6rem;padding:.3rem 0;border-top:1px solid var(--line);font-size:.9rem;}
.list div:first-child{border-top:none;}
.list em{font-style:normal;color:var(--dim);white-space:nowrap;}
#toast{position:fixed;left:50%;bottom:calc(1.2rem + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--bg);border:1px solid var(--acc);padding:.45rem .9rem;font-size:.9rem;}
@media (max-width:600px){
.p{margin-top:calc(1.6rem + env(safe-area-inset-top));}
#card{gap:.8rem;}
#card img{width:48px;height:48px;}
#card h1{font-size:1.3rem;}
.records{grid-template-columns:1fr 1fr;}
.records b{font-size:1.15rem;}
.grid{grid-template-columns:1fr 1fr;}
.kv{grid-template-columns:1fr 1fr;}
.ph img{width:56px;}
.ph h1{font-size:1.5rem;}
.bars div{grid-template-columns:5.5rem 1fr 4.5rem;}
input.f,select.f{font-size:16px;}
.sec input.f{width:7rem;}
}