:root{
  --sky:#3f8fd9;--sky-d:#1f5fa8;--sky-l:#dcebf9;--navy:#123a6b;
  --sand:#efe6d2;--sand-d:#c9b98f;--sand-l:#f8f4ea;--paper:#ffffff;
  --seal:#c8372d;--ink:#222;--mute:#6f6a5e;--link:#1a55a5;
  --up:#23862e;--dn:#c0392b;--amber:#ffb000;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#ffffff}}
:root[data-theme="dark"]{--paper:#ffffff}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;color:var(--ink);font:12px/1.45 Verdana,Tahoma,Geneva,sans-serif;
  background:#cfe3f6 linear-gradient(180deg,#5aa0e0 0,#9cc6ee 170px,#d9e8f4 340px,#efe6d2 620px,#e6d9bb 100%) no-repeat;min-height:100vh}
a{color:var(--link);text-decoration:underline;cursor:pointer}
a:hover{color:var(--seal)}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px dotted var(--seal);outline-offset:1px}
.mono{font-family:"Courier New",Courier,monospace;font-weight:bold}

#wrap{width:1000px;max-width:100%;margin:14px auto 0;background:var(--paper);border:1px solid #7fa6cc;box-shadow:0 0 0 4px rgba(255,255,255,.45),0 4px 14px rgba(20,50,90,.25)}

/* header */
#top{display:flex;align-items:center;gap:14px;padding:12px 16px 10px;background:linear-gradient(#fdfefe,#e7f0f9);border-bottom:1px solid #a9c4e0;position:relative}
#top .seal{width:72px;height:72px;flex:none}
#top .name{flex:1;min-width:0}
#top .w{font:bold 38px/1 Georgia,"Times New Roman",serif;color:var(--seal);letter-spacing:-1px;text-shadow:1px 1px 0 #fff,2px 2px 0 rgba(0,0,0,.08)}
#top .beta{display:inline-block;vertical-align:top;margin:3px 0 0 6px;background:#f7931e;color:#fff;font:bold 10px Verdana,sans-serif;padding:1px 5px;border-radius:3px;transform:rotate(-8deg);box-shadow:1px 1px 0 #b36a10}
#top .sub{font:bold 15px "Trebuchet MS",Verdana,sans-serif;color:var(--navy);margin-top:4px}
#top .sub2{color:var(--mute);font-size:11px}
#top .acts{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
#top .acts .row{display:flex;gap:6px}
#top .links{font-size:11px;color:var(--mute)}

.gl{display:inline-block;border-radius:4px;padding:5px 14px;font:bold 12px Verdana,sans-serif;color:#fff;border:1px solid;text-decoration:none;text-shadow:0 -1px 0 rgba(0,0,0,.3);white-space:nowrap}
.gl:hover{color:#fff;filter:brightness(1.07)}
.gl:active{filter:brightness(.93)}
.gl.blue{background:linear-gradient(#7cbcf2,#3f8fd9 50%,#2b78c6 51%,#3a86d2);border-color:#1f5fa8}
.gl.green{background:linear-gradient(#9ee07a,#4fb036 50%,#3c9a25 51%,#4aa932);border-color:#2f7d1e}
.gl.red{background:linear-gradient(#f08a80,#d2463b 50%,#bb3329 51%,#c83d33);border-color:#8e2219}
.gl.big{font-size:15px;padding:9px 22px}
.gl.sm{font-size:11px;padding:2px 9px}
.gl[disabled]{opacity:.5;cursor:default;filter:grayscale(.6)}
#walletBtn.on{font-family:"Courier New",monospace}

/* nav tabs */
#nav{display:flex;gap:3px;padding:8px 12px 0;background:linear-gradient(#2b78c6,#1f5fa8);border-bottom:1px solid #123a6b;overflow-x:auto}
#nav a{display:block;padding:6px 16px 5px;border:1px solid #123a6b;border-bottom:0;border-radius:6px 6px 0 0;color:#123a6b;text-decoration:none;font:bold 13px "Trebuchet MS",Verdana,sans-serif;background:linear-gradient(#f1f7fd,#c3dbf2);white-space:nowrap}
#nav a:hover{background:linear-gradient(#fff,#d7e8f8)}
#nav a.on{background:#fff;color:var(--seal);position:relative;top:1px}
#nav .sp{flex:1}
#nav .clock{align-self:center;color:#dcebf9;font-size:11px;white-space:nowrap;padding-bottom:4px}

/* LED board */
#led{position:relative;background:#140c00;border-top:1px solid #000;border-bottom:3px solid #3a2a10;height:40px;overflow:hidden;display:flex;align-items:center}
#led .lbl{position:relative;z-index:2;height:100%;display:flex;align-items:center;padding:0 12px;background:#140c00;border-right:2px solid #3a2a10;font:26px/1 VT323,"Courier New",monospace;color:#ff5a3c;letter-spacing:1px;white-space:nowrap}
#led .run{white-space:nowrap;font:28px/1 VT323,"Courier New",monospace;color:var(--amber);letter-spacing:1px;display:inline-block;animation:run 110s linear infinite;padding-left:12px}
#led .run span{margin-right:34px}
#led .u{color:#7dff6a}#led .d{color:#ff5a3c}
#led::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background-image:radial-gradient(circle,transparent 0.9px,rgba(20,12,0,.85) 1.5px);background-size:3px 3px}
@keyframes run{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* layout */
#main{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px;padding:14px}
#main.full{grid-template-columns:minmax(0,1fr)}
.box{border:1px solid var(--sand-d);background:#fff;margin-bottom:14px}
.box>h2,.box>.h{margin:0;padding:6px 10px;font:bold 13px "Trebuchet MS",Verdana,sans-serif;color:var(--navy);background:linear-gradient(#faf6ec,#e9dec3);border-bottom:1px solid var(--sand-d);display:flex;align-items:center;gap:8px}
.box>.h .r{margin-left:auto;font:normal 11px Verdana,sans-serif}
.box .in{padding:10px}
.crumb{font-size:11px;color:var(--mute);margin:0 0 8px}
.welcome{display:flex;gap:16px;align-items:center;padding:14px 16px;background:linear-gradient(#fffbe8,#fff3c4);border:1px solid #e0c96a;margin-bottom:14px}
.welcome h1{margin:0 0 4px;font:bold 22px Georgia,serif;color:#5a3a00}
.welcome p{margin:0;color:#5f5130;max-width:470px}
.welcome .gl{margin-left:auto}

table.t{width:100%;border-collapse:collapse}
table.t th{text-align:left;font-weight:bold;font-size:11px;color:#fff;background:linear-gradient(#5b9ee0,#2f7cc9);padding:4px 7px;border-right:1px solid #6aa6e0;white-space:nowrap}
table.t td{padding:5px 7px;border-bottom:1px solid #eee4cc;white-space:nowrap;vertical-align:middle}
table.t tr:nth-child(even) td{background:var(--sand-l)}
table.t tr.click{cursor:pointer}
table.t tr.click:hover td{background:#fff7d1}
table.t .r,table.t td.num{text-align:right}
td.num{font-family:"Courier New",monospace;font-weight:bold}
.tw{overflow-x:auto}
.tkl{font-family:"Courier New",monospace;font-weight:bold;color:var(--navy)}
a.tkl{text-decoration:none}
.cy{color:var(--link)}
.yl{color:#7a4a00}
.up{color:var(--up)}
.dn{color:var(--dn)}
.dim{color:var(--mute)}
.tlogo{width:22px;height:22px;vertical-align:middle;margin-right:6px}
.filters{font-size:11px}
.filters a{margin:0 3px}
.filters a.on{font-weight:bold;color:var(--seal);text-decoration:none}
.search{border:1px solid #9fb6cf;padding:3px 6px;font:11px Verdana,sans-serif;width:200px;border-radius:2px;box-shadow:inset 1px 1px 2px rgba(0,0,0,.12)}
.fu{animation:fu 1s}.fd{animation:fd 1s}
@keyframes fu{from{background:#bff0b8}to{background:transparent}}
@keyframes fd{from{background:#ffc9c2}to{background:transparent}}
tr.new td{animation:nr 1.4s}
@keyframes nr{from{background:#fff2a8}to{}}

.pbar{height:12px;border:1px solid #9c8a57;background:#f4efe0;border-radius:2px;overflow:hidden;position:relative}
.pbar i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#ffd566,#e3a21a);background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px),linear-gradient(#ffd566,#e3a21a);background-size:17px 17px,100% 100%;animation:stripe 1s linear infinite;border-right:1px solid #9c7a10}
@keyframes stripe{from{background-position:0 0,0 0}to{background-position:17px 0,0 0}}
.pb-sm{width:90px;display:inline-block;vertical-align:middle;margin-left:6px}

.side-list{list-style:none;margin:0;padding:0}
.side-list li{display:flex;align-items:center;gap:8px;padding:6px 10px;border-bottom:1px dotted var(--sand-d)}
.side-list li:last-child{border-bottom:0}
.side-list img{width:26px;height:26px}
.side-list .grow{flex:1;min-width:0}
.quote{font:italic 14px/1.4 Georgia,serif;color:#3b2f17;margin:0 0 6px}
.badges{display:flex;flex-wrap:wrap;gap:6px}
.b88{width:88px;height:31px;border:1px solid #666;font:bold 9px/1.1 Verdana,sans-serif;display:flex;align-items:center;justify-content:center;text-align:center;padding:2px}
.b88.a{background:linear-gradient(#fff,#ddd);color:#333}
.b88.b{background:#1f5fa8;color:#fff;border-color:#0e3564}
.b88.c{background:#000;color:#ffb000;font-family:VT323,monospace;font-size:14px;font-weight:normal}

/* token page */
.tokhead{display:flex;gap:14px;align-items:center;padding:12px}
.tokhead img{width:64px;height:64px}
.tokhead h1{margin:0;font:bold 24px Georgia,serif;color:var(--ink)}
.tokhead .tkl{font-size:17px;margin-left:6px}
.pill{display:inline-block;font:bold 10px Verdana,sans-serif;background:#fff3c4;border:1px solid #d8b440;color:#6b4a00;padding:1px 6px;border-radius:8px;vertical-align:middle;margin-left:6px}
.ca{font-family:"Courier New",monospace;font-weight:bold;color:var(--link);word-break:break-all}
.kvt td:first-child{color:var(--mute);width:48%}
.kvt td:last-child{text-align:right;font-family:"Courier New",monospace;font-weight:bold}
.ctool{display:flex;gap:4px;align-items:center;padding:6px 8px;background:#f3f6fa;border-bottom:1px solid #d4dfeb;flex-wrap:wrap;font-size:11px}
.ctool button{background:linear-gradient(#fff,#e2e8ef);border:1px solid #9fb2c8;border-radius:3px;padding:1px 8px;font-size:11px;color:#123a6b}
.ctool button.on{background:linear-gradient(#5b9ee0,#2f7cc9);color:#fff;border-color:#1f5fa8}
.ctool .sp{width:10px}
canvas.chart{display:block;width:100%;height:340px}
.powered{font-size:10px;color:#999;text-align:right;padding:2px 8px 4px}
.otabs{display:flex;gap:2px;padding:6px 8px 0;background:#f3f6fa;border-top:1px solid #d4dfeb;border-bottom:1px solid #9fb2c8}
.otabs button{border:1px solid #9fb2c8;border-bottom:0;border-radius:4px 4px 0 0;background:linear-gradient(#fff,#dfe8f2);padding:4px 12px;font:bold 11px Verdana,sans-serif;color:#123a6b}
.otabs button.on{background:#fff;color:var(--seal);position:relative;top:1px}
.bs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:8px}
.bs button{border:1px solid #9fb2c8;background:linear-gradient(#fff,#e2e8ef);padding:5px;font-weight:bold;border-radius:3px;color:#444}
.bs button.on.b{background:linear-gradient(#9ee07a,#4fb036);color:#fff;border-color:#2f7d1e}
.bs button.on.s{background:linear-gradient(#f08a80,#c83d33);color:#fff;border-color:#8e2219}
label.fl{display:block;font-weight:bold;font-size:11px;margin:8px 0 3px;color:#333}
.inp{width:100%;border:1px solid #9fb6cf;padding:5px 6px;font:13px Verdana,sans-serif;border-radius:2px;box-shadow:inset 1px 1px 2px rgba(0,0,0,.12);background:#fff}
input.inp.m{font:bold 14px "Courier New",monospace}
textarea.inp{resize:vertical;min-height:70px}
.quick{display:flex;gap:3px;margin-top:4px}
.quick button{flex:1;border:1px solid #c9b98f;background:var(--sand-l);font-size:11px;padding:2px 0;border-radius:2px}
.row2{display:flex;justify-content:space-between;margin:4px 0}
.row2 b{font-family:"Courier New",monospace}
.msg{margin-top:8px;min-height:1em;font-size:11px}
.msg.on{padding:6px 8px;background:#fff0f0;border:1px solid #e3a1a1;color:#9b1c14}
canvas.mini{display:block;width:100%;height:56px;margin-top:6px;border:1px solid #e6e0d0}
canvas.spark{display:block;width:110px;height:24px}
fieldset{border:1px solid var(--sand-d);margin:0 0 12px;padding:8px 12px 12px;background:var(--sand-l)}
legend{font:bold 12px "Trebuchet MS",Verdana,sans-serif;color:var(--navy);padding:0 6px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.upl{display:flex;gap:12px;align-items:center}
.upl .pv{width:88px;height:88px;border:2px dashed #b7a57a;background:#fff;display:grid;place-items:center;color:var(--mute);font-size:10px;text-align:center;overflow:hidden;flex:none}
.upl .pv img{width:100%;height:100%;object-fit:cover}
.notice{padding:7px 10px;border:1px solid #e6db55;background:#fffbcc;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.notice.ok{border-color:#9bd08a;background:#eefbe8}
.pcard{display:flex;gap:10px;align-items:center}
.pcard img{width:52px;height:52px;object-fit:cover;border:1px solid #ddd}
.article{padding:6px 18px 18px;font-size:13px;line-height:1.65;max-width:680px}
.article h1{font:bold 26px Georgia,serif;margin:10px 0 12px;color:#222}
.article h2{font:bold 17px "Trebuchet MS",Verdana,sans-serif;color:var(--navy);margin:20px 0 6px;border-bottom:1px dotted var(--sand-d);padding-bottom:3px}
.article p{margin:0 0 10px}
.article blockquote{margin:12px 0;padding:8px 14px;background:#fffbe8;border-left:4px solid var(--seal);font:italic 16px Georgia,serif}
.src{font-size:11px;color:var(--mute)}
.empty{padding:12px;color:var(--mute);font-style:italic}

#foot{padding:12px 16px;border-top:1px solid #a9c4e0;background:linear-gradient(#e7f0f9,#fdfefe);font-size:11px;color:var(--mute);display:flex;gap:14px;align-items:center;flex-wrap:wrap}
#foot .disc{flex:1 1 380px}
#below{text-align:center;font-size:10px;color:#7c6c46;padding:8px 0 20px}

/* modal + toast */
#modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:50;padding:16px}
#modal.on{display:flex}
.win{width:430px;max-width:100%;background:#fff;border:1px solid #1f5fa8;box-shadow:0 6px 30px rgba(0,0,0,.5);border-radius:6px;overflow:hidden}
.win .tb{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#5b9ee0,#2f7cc9);color:#fff;padding:6px 10px;font:bold 13px "Trebuchet MS",Verdana,sans-serif}
.win .tb button{background:none;border:0;color:#fff;font:bold 12px Verdana,sans-serif;text-decoration:underline}
.win .bd{padding:14px}
.win .opt{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;background:linear-gradient(#fff,#eef3f8);border:1px solid #9fb2c8;border-radius:4px;padding:8px 10px;margin-bottom:6px}
.win .opt:hover{background:#fff7d1}
.win .opt span{font-size:11px;color:var(--mute)}
.win .err{color:#9b1c14;min-height:1em;margin-top:6px}
.win ol{margin:0;padding-left:20px;line-height:1.7}
#toast{position:fixed;right:14px;bottom:14px;z-index:40;border:1px solid #e6db55;background:#fffbcc;padding:7px 12px;box-shadow:0 2px 8px rgba(0,0,0,.2);display:none;font-size:11px;max-width:calc(100% - 28px)}
#toast.on{display:block;animation:ti .25s}
@keyframes ti{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.loading{padding:60px 0;text-align:center;color:var(--mute)}
.loading img{display:block;margin:0 auto 10px;width:48px;animation:spin 1.4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

@media (max-width:1030px){#wrap{margin-top:0;border-left:0;border-right:0}}
@media (max-width:780px){
  #main{grid-template-columns:minmax(0,1fr);padding:10px}
  #top{flex-wrap:wrap}
  #top .seal{width:52px;height:52px}
  #top .w{font-size:30px}
  #top .acts{width:100%;align-items:stretch}
  #top .acts .row .gl{flex:1;text-align:center}
  .welcome{flex-direction:column;align-items:flex-start}
  .welcome .gl{margin-left:0}
  .two{grid-template-columns:1fr}
  #nav .clock{display:none}
  canvas.chart{height:270px}
  .search{width:100%}
}
@media (prefers-reduced-motion:reduce){
  #led .run,.pbar i,.loading img{animation:none}
  .fu,.fd,tr.new td,#toast.on{animation:none}
}