/* PROMPT: a 1998 desktop. Bevels are box-shadows (out = raised, in = sunken), like the real thing. */
:root {
  --teal: #008080; --face: #c0c0c0; --hi: #fff; --lt: #dfdfdf; --sh: #808080; --dk: #0a0a0a; --navy: #000080; --blue: #1084d0;
  --ink: #0a0a0a; --tip: #ffffe1;
  --r1: #ff4d4d; --r2: #ff9a2e; --r3: #ffd83a; --r4: #4fd65a; --r5: #36a8ff; --r6: #7d63ff; --r7: #d45cff;
  --rainbow: linear-gradient(90deg, var(--r1) 0 14.3%, var(--r2) 0 28.6%, var(--r3) 0 42.9%, var(--r4) 0 57.1%, var(--r5) 0 71.4%, var(--r6) 0 85.7%, var(--r7) 0);
  --ok: #55ff55; --err: #ff5555; --hl: #ffff55; --cy: #55ffff; --dim: #8a8a8a;
  --ui: "Pixelify Sans", Tahoma, system-ui, sans-serif; --mono: "VT323", ui-monospace, Consolas, monospace; --disp: "Press Start 2P", "VT323", monospace;
  --out: inset -1px -1px var(--dk), inset 1px 1px var(--hi), inset -2px -2px var(--sh), inset 2px 2px var(--lt);
  --in: inset -1px -1px var(--hi), inset 1px 1px var(--sh), inset -2px -2px var(--lt), inset 2px 2px var(--dk);
  --thin: inset -1px -1px var(--hi), inset 1px 1px var(--sh);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; -webkit-text-size-adjust: 100%; }
[hidden] { display: none !important; }
body { font-variant-ligatures: none; font-feature-settings: "liga" 0, "clig" 0, "calt" 0; margin: 0; background: var(--teal); color: var(--ink); font: 400 15px/1.45 var(--ui); padding-bottom: 56px; overflow-x: hidden; }
body.lock { overflow: hidden; }
a { color: inherit; }
button { font: inherit; color: inherit; }
img { display: block; }
.px { image-rendering: pixelated; display: block; }
::selection { background: var(--navy); color: #fff; }

/* ---------- buttons, fields ---------- */
.b98 { font: 500 14px/1 var(--ui); background: var(--face); border: 0; box-shadow: var(--out); padding: 8px 16px; min-height: 32px; cursor: pointer; color: var(--ink);
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; white-space: nowrap; }
.b98:active, .b98.on { box-shadow: var(--in); padding: 9px 15px 7px 17px; }
.b98.on { background: repeating-conic-gradient(var(--face) 0 25%, #fff 0 50%) 0 0 / 2px 2px; }
.b98:focus-visible { outline: 1px dotted #000; outline-offset: -5px; }
.b98.pri { box-shadow: 0 0 0 1px var(--dk), var(--out); }
.b98.pri:active { box-shadow: 0 0 0 1px var(--dk), var(--in); }
.b98:disabled { color: var(--sh); text-shadow: 1px 1px #fff; cursor: default; }
.b98 .px { width: 16px; height: 16px; }
.f98 { background: #fff; box-shadow: var(--in); border: 0; padding: 6px 8px; font: 400 15px var(--ui); color: var(--ink); min-width: 0; }
.f98:focus { outline: none; }

/* ---------- windows ---------- */
.w { background: var(--face); padding: 3px; box-shadow: var(--out); position: relative; display: flex; flex-direction: column; min-width: 0; }
.w.hid { display: none; }
.w.max { position: fixed; inset: 6px 6px 42px; z-index: 60 !important; translate: none !important; }
.w.max > .bd { overflow: auto; }
.tb { height: 22px; flex: none; display: flex; align-items: center; gap: 4px; padding: 0 2px 0 4px; background: linear-gradient(90deg, var(--navy), var(--blue)); color: #fff;
  font: 600 13px/1 var(--ui); user-select: none; -webkit-user-select: none; }
.tb .ti { flex: 1; display: flex; align-items: center; gap: 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; letter-spacing: .3px; }
.tb .ti .px { width: 16px; height: 16px; flex: none; }
.ctl { display: flex; gap: 2px; flex: none; }
.ctl button { width: 16px; height: 14px; padding: 0; border: 0; background: var(--face) center / 8px 7px no-repeat; box-shadow: var(--out); cursor: pointer; }
.ctl button:active { box-shadow: var(--in); background-position: calc(50% + 1px) calc(50% + 1px); }
.ctl [data-act=min] { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 7' shape-rendering='crispEdges'><rect x='1' y='5' width='6' height='2'/></svg>"); }
.ctl [data-act=max] { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9' shape-rendering='crispEdges'><path fill-rule='evenodd' d='M0 0h9v9H0zM1 2v6h7V2z'/></svg>"); background-size: 9px 9px; }
.ctl [data-act=close] { margin-left: 2px; background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 7' shape-rendering='crispEdges'><path d='M0 0h2v1H0zM6 0h2v1H6zM1 1h2v1H1zM5 1h2v1H5zM2 2h4v1H2zM3 3h2v1H3zM2 4h4v1H2zM1 5h2v1H1zM5 5h2v1H5zM0 6h2v1H0zM6 6h2v1H6z'/></svg>"); }
.menu { display: flex; gap: 14px; padding: 3px 6px 2px; font-size: 13px; flex: none; }
.menu u { text-decoration: underline; text-underline-offset: 1px; }
.bd { padding: 6px; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.sb { display: flex; gap: 2px; margin-top: 2px; font-size: 12px; flex: none; }
.sb > span { box-shadow: var(--thin); padding: 2px 6px; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb > span:last-child { flex: none; }
.well { background: #fff; box-shadow: var(--in); padding: 10px 12px; }
.blk { background: #000; box-shadow: var(--in); color: #c8c8c8; font: 20px/1.15 var(--mono); padding: 8px 10px; overflow: auto; margin: 0; white-space: pre-wrap; word-break: break-word; }
.ok { color: var(--ok); } .err { color: var(--err); } .hl { color: var(--hl); } .cy { color: var(--cy); } .dim { color: var(--dim); } .wh { color: #fff; }
.blk a { color: var(--cy); }

/* ---------- live ticker + nav ---------- */
.tick { position: sticky; top: 0; z-index: 31; background: #000; color: var(--ok); font: 19px/26px var(--mono); height: 26px; overflow: hidden; white-space: nowrap; display: flex; }
.tick .lv { flex: none; background: var(--err); color: #000; padding: 0 10px; font: 400 10px/26px var(--disp); position: relative; z-index: 1; }
.tick .lv::before { content: ""; display: inline-block; width: 6px; height: 6px; background: #000; margin-right: 7px; vertical-align: 1px; animation: blink 1s steps(2) infinite; }
.tick .rail { overflow: hidden; flex: 1; }
.tick .tr { display: inline-block; padding-left: 16px; animation: mq 60s linear infinite; }
.tick .tr span { margin-right: 34px; }
.tick .tr b { color: #fff; font-weight: 400; }
@keyframes mq { to { transform: translateX(-50%); } }
@keyframes blink { 50% { opacity: 0; } }
.nav { position: sticky; top: 26px; z-index: 30; background: var(--face); box-shadow: inset 0 -1px var(--sh), inset 0 -2px var(--dk), inset 0 1px var(--hi); height: 48px; display: flex; align-items: center; gap: 2px; padding: 0 10px; }
.logo { display: flex; align-items: center; gap: 9px; text-decoration: none; margin-right: 14px; font: 400 14px var(--disp); letter-spacing: 1px; }
.mk { background: #000; display: grid; place-items: center; box-shadow: var(--out); }
.logo .mk { width: 32px; height: 32px; padding: 7px 5px; box-shadow: 1px 1px 0 var(--dk), inset 1px 1px var(--sh); }
.mk svg { width: 100%; height: auto; image-rendering: pixelated; }
.nav .lk { text-decoration: none; padding: 7px 11px; font-size: 14px; border: 0; background: none; cursor: pointer; }
.nav .lk:hover { box-shadow: inset 1px 1px var(--hi), inset -1px -1px var(--sh); }
.nav .sp { flex: 1; }
.nav::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 4px; background: var(--rainbow); }
.nav .wal { min-width: 150px; }

/* ---------- hero ---------- */
.hero { display: grid; grid-template-columns: 80px minmax(0, 1.18fr) minmax(0, 1fr); gap: 22px; max-width: 1400px; margin: 0 auto; padding: 30px 22px 10px; align-items: start; }
.icons { display: grid; gap: 16px; justify-items: center; padding-top: 4px; }
.ic { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 78px; color: #fff; font: 400 13px/1.25 var(--ui); text-align: center; background: none; border: 0; cursor: pointer; padding: 0; text-decoration: none; }
.ic .px { width: 34px; height: 34px; }
.ic span { padding: 1px 3px; text-shadow: 1px 1px 0 rgba(0, 0, 0, .35); }
.ic:hover span, .ic:focus-visible span { background: var(--navy); outline: 1px dotted #fff; text-shadow: none; }
.ic:focus-visible { outline: none; }
.ic:hover .px, .ic:focus-visible .px { filter: brightness(.7) sepia(1) hue-rotate(190deg) saturate(3); }
.h1 { font: 400 clamp(26px, 3.3vw, 46px)/1.3 var(--disp); color: #fff; text-shadow: 4px 4px 0 #000; margin: 6px 0 16px; letter-spacing: -1px; }
.h1 .cur { display: inline-block; width: .55em; height: .14em; background: #fff; box-shadow: 4px 4px 0 #000; margin-left: .15em; animation: blink 1.1s steps(2) infinite; vertical-align: baseline; }
.lede { color: #fff; font: 400 18px/1.5 var(--ui); max-width: 58ch; margin: 0 0 18px; text-shadow: 1px 1px 0 rgba(0, 0, 0, .3); }
.lede b { font-weight: 600; background: var(--navy); padding: 0 4px; }
.cta { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }
.hr { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* terminal */
.term .scr { background: #000; box-shadow: var(--in); color: #c8c8c8; font: 21px/1.17 var(--mono); padding: 10px 12px 8px; height: 430px; overflow: auto; cursor: text; display: flex; flex-direction: column; }
.term .scr.drop { outline: 2px dashed var(--hl); outline-offset: -6px; }
.term .out { flex: none; }
.ln { white-space: pre-wrap; word-break: break-word; min-height: 1.17em; }
.ln a { color: var(--cy); }
.ln a.cmd { color: var(--hl); text-decoration: none; border-bottom: 1px dotted; cursor: pointer; }
.ln .thumb { width: 72px; height: 72px; image-rendering: pixelated; box-shadow: 0 0 0 2px #c8c8c8; margin: 4px 0; display: inline-block; vertical-align: top; }
.inrow { display: flex; align-items: baseline; flex: none; }
.pr { color: #fff; white-space: pre; }
.inrow input { flex: 1; min-width: 0; background: none; border: 0; outline: none; color: #fff; font: inherit; caret-color: #fff; padding: 0; margin: 0; }
.inrow input::placeholder { color: #4a4a4a; }
.inrow.busy input { visibility: hidden; width: 0; flex: 0; }
.inrow.busy::after { content: "▌"; animation: blink .8s steps(2) infinite; color: #fff; }
.chips { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 0 2px; }
.chip { font: 500 12px/1 var(--ui); padding: 6px 9px; min-height: 26px; letter-spacing: .5px; }
.chip:active { padding: 7px 8px 5px 10px; }
.note { font-size: 12px; color: #333; padding: 4px 2px 0; }

/* launch.rs, logs, tests */
.code { margin: 0; background: #fff; box-shadow: var(--in); font: 19px/1.12 var(--mono); padding: 8px 10px; height: 352px; overflow: auto; white-space: pre; color: #000; }
.code .kw { color: #0000ff; } .code .st { color: #a31515; } .code .cm { color: #008000; } .code .nu { color: #098658; } .code .ty { color: #267f99; } .code .ph { color: #a0a0a0; }
.code .ch { background: #ffff99; animation: fl 1.4s ease-out forwards; }
@keyframes fl { to { background: transparent; } }
.log { height: 186px; margin: 0; white-space: pre; overflow-x: hidden; font-size: 18px; }
.tests { background: #fff; box-shadow: var(--in); height: 204px; overflow: auto; padding: 6px 8px; font-size: 13.5px; }
.tests div { display: flex; gap: 8px; align-items: center; padding: 2px 0; animation: drop .25s steps(3); }
.tag { font: 17px/1 var(--mono); width: 44px; text-align: center; padding: 2px 0 1px; background: #e8e8e8; color: #777; box-shadow: var(--thin); flex: none; }
.tag.pass { background: #0a7a0a; color: #fff; } .tag.fail { background: #c00; color: #fff; } .tag.run { background: var(--navy); color: #fff; animation: blink .6s steps(2) infinite; }
.tag.skip { background: #9a9a9a; color: #fff; }
.dp .log { height: 170px; }

/* ---------- sections ---------- */
.sec { max-width: 1400px; margin: 0 auto; padding: 56px 22px 4px; }
.sh2 { font: 400 clamp(15px, 1.7vw, 22px)/1.4 var(--disp); color: #fff; text-shadow: 3px 3px 0 #000; margin: 0 0 8px; }
.sh2 i { color: var(--hl); font-style: normal; }
.sub { color: #eafffe; margin: 0 0 22px; font-size: 17px; max-width: 70ch; text-shadow: 1px 1px 0 rgba(0, 0, 0, .25); }
.g3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.g3.tg { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.stats { padding-top: 26px; }
.stat .bd { flex-direction: row; align-items: center; gap: 14px; padding: 12px 14px; }
.stat .px { width: 40px; height: 40px; flex: none; }
.stat .bd b { display: block; font: 400 clamp(18px, 2vw, 26px)/1.25 var(--disp); }
.stat .bd span { font-size: 13px; color: #333; }
.feat .bd { gap: 10px; padding: 14px; }
.feat .bd > .px { width: 40px; height: 40px; }
.feat h3 { margin: 0; font: 600 18px var(--ui); }
.feat p { margin: 0; font-size: 15px; color: #222; }
.feat code, .faq code, .sub code, .lede code { font: 18px var(--mono); background: #000; color: #fff; padding: 0 5px; text-shadow: none; }
.steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 12px; align-items: center; }
.arrow { font: 400 22px var(--disp); color: #fff; text-shadow: 3px 3px 0 #000; }
.stp .bd { padding: 16px; gap: 8px; }
.stp .n { font: 400 30px var(--disp); color: var(--navy); }
.stp h3 { margin: 0; font: 600 19px var(--ui); }
.stp p { margin: 0; color: #222; }
.stp .ex { font: 19px/1.2 var(--mono); background: #000; color: #fff; padding: 6px 8px; box-shadow: var(--in); }

/* explorer */
.tools { display: flex; gap: 6px; align-items: center; padding: 2px 0 6px; flex-wrap: wrap; }
.tools .adr { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 200px; font-size: 13px; }
.tools .adr .f98 { flex: 1; font: 18px var(--mono); padding: 3px 8px; }
.tools .b98 { padding: 6px 12px; min-height: 30px; }
.tools .b98.on { padding: 7px 11px 5px 13px; }
.files { background: #fff; box-shadow: var(--in); min-height: 290px; padding: 10px; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 6px; align-content: start; }
.tk { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 10px; padding: 8px; text-decoration: none; border: 1px dotted transparent; align-items: center; }
.tk:hover, .tk:focus-visible { background: var(--navy); color: #fff; outline: none; border-color: #fff; }
.tk img { width: 58px; height: 58px; object-fit: cover; image-rendering: pixelated; box-shadow: 0 0 0 1px var(--dk); background: #ddd; }
.tk b { font: 400 12px/1.4 var(--disp); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk .nm { font-size: 14px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk .mt { display: flex; justify-content: space-between; font: 17px/1 var(--mono); margin-top: 3px; gap: 6px; }
.pg { height: 14px; box-shadow: var(--in); padding: 2px; background: #fff; margin-top: 4px; }
.pg i { display: block; height: 100%; background: repeating-linear-gradient(90deg, var(--navy) 0 7px, transparent 7px 9px); max-width: 100%; }
.empty { grid-column: 1 / -1; display: grid; justify-items: center; text-align: center; gap: 10px; padding: 46px 16px; }
.empty .px { width: 64px; height: 64px; }
.empty b { font: 400 13px/1.5 var(--disp); }
.empty span { max-width: 46ch; color: #333; }

/* network */
.net { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 18px; }
.net .col { display: grid; gap: 18px; align-content: start; }
canvas.mon { width: 100%; height: 230px; display: block; background: #000; box-shadow: var(--in); }
.bars { height: 120px; background: #000; box-shadow: var(--in); display: flex; align-items: flex-end; gap: 3px; padding: 8px; }
.bars i { flex: 1; min-height: 4px; transition: height .4s steps(6);
  background: repeating-linear-gradient(0deg, transparent 0 4px, #000 4px 6px), linear-gradient(0deg, var(--r7) 0 14.3%, var(--r6) 0 28.6%, var(--r5) 0 42.9%, var(--r4) 0 57.1%, var(--r3) 0 71.4%, var(--r2) 0 85.7%, var(--r1) 0) bottom / 100% 104px no-repeat; }
.bars i.pk { box-shadow: 0 -3px 0 #fff; }
.inf { font: 20px/1.3 var(--mono); margin: 0; white-space: pre-wrap; word-break: break-word; }
.inf .k { color: #555; }
.donut { display: flex; gap: 16px; align-items: center; }
.donut svg { width: 120px; height: 120px; flex: none; }
.lgd { display: grid; gap: 6px; font-size: 14px; }
.lgd span { display: flex; align-items: center; gap: 8px; }
.lgd i { width: 14px; height: 14px; box-shadow: 0 0 0 1px #000; flex: none; }

/* token.inf */
.tok .bd { padding: 16px; gap: 14px; }
.tok .top { display: flex; gap: 16px; align-items: center; }
.tok .mk.big { width: 96px; height: 96px; padding: 22px 15px; flex: none; }
.tok h3 { margin: 0; font: 400 24px var(--disp); }
.tok p { margin: 4px 0 0; }
.ca { display: flex; gap: 6px; }
.ca .f98 { flex: 1; font: 19px var(--mono); padding: 5px 8px; cursor: copy; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.btns { display: flex; gap: 8px; flex-wrap: wrap; }

/* faq notepad */
.faq .well { font: 15px/1.6 var(--ui); max-height: 470px; overflow: auto; padding: 14px 16px; margin: 0; }
.faq dt { font-weight: 600; margin-top: 12px; }
.faq dt:first-child { margin-top: 0; }
.faq dt::before { content: "Q: "; color: var(--navy); }
.faq dd { margin: 2px 0 0; color: #222; }

/* ready.exe */
.ready { max-width: 520px; margin: 0 auto; }
.ready .bd { padding: 18px; gap: 16px; }
.ready .row { display: flex; gap: 16px; align-items: center; }
.ready .row .px { width: 48px; height: 48px; flex: none; }
.ready p { margin: 0; font-size: 16px; }
.ready .btns { justify-content: flex-end; }
.pow { display: flex; gap: 22px; justify-content: center; align-items: center; color: #fff; font-size: 14px; padding: 40px 16px 8px; flex-wrap: wrap; }
.pow span { display: flex; align-items: center; gap: 8px; }
.pow img { width: 22px; height: 22px; border-radius: 50%; }
.foot { text-align: center; color: #d6fffd; font-size: 13px; padding: 6px 16px 20px; }

/* ---------- coin page ---------- */
.coin { max-width: 1100px; margin: 0 auto; padding: 30px 22px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.coin .back { grid-column: 1 / -1; justify-self: start; }
.coin .head { display: flex; gap: 16px; align-items: center; }
.coin .head img { width: 112px; height: 112px; image-rendering: pixelated; box-shadow: 0 0 0 1px #000, 3px 3px 0 var(--sh); object-fit: cover; flex: none; }
.coin h2 { margin: 0; font: 400 clamp(18px, 2.4vw, 28px)/1.3 var(--disp); word-break: break-all; }
.coin .nm { font-size: 17px; }
.kv { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; font: 20px/1.25 var(--mono); margin: 0; }
.kv dt { color: #555; } .kv dd { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv a { color: var(--navy); }

/* ---------- taskbar + start menu ---------- */
.task { position: fixed; left: 0; right: 0; bottom: 0; background: var(--face); box-shadow: inset 0 1px var(--lt), inset 0 2px var(--hi); display: flex; align-items: center; gap: 4px;
  padding: 4px 4px calc(4px + env(safe-area-inset-bottom)); z-index: 50; height: calc(38px + env(safe-area-inset-bottom)); }
.start { font: 700 14px/1 var(--ui); padding: 4px 8px 4px 5px; min-height: 30px; gap: 6px; flex: none; }
.start:active, .start.on { padding: 5px 7px 3px 6px; }
.start .mk { width: 22px; height: 18px; padding: 4px 3px; box-shadow: none; }
.tasks { display: flex; gap: 4px; flex: 1; min-width: 0; overflow: hidden; }
.tasks .b98 { justify-content: flex-start; min-width: 0; width: 160px; flex: 0 1 160px; font-size: 13px; padding: 4px 8px; min-height: 30px; }
.tasks .b98.on { padding: 5px 7px 3px 9px; }
.tasks .b98 span { overflow: hidden; text-overflow: ellipsis; }
.tasks .b98.mini { color: #444; font-style: italic; }
.tray { margin-left: auto; box-shadow: var(--thin); padding: 0 10px; height: 30px; display: flex; align-items: center; gap: 12px; font-size: 13px; flex: none; }
.tray button { background: none; border: 0; padding: 0; cursor: pointer; display: flex; align-items: center; gap: 6px; font-size: 13px; }
.tray .dot { width: 8px; height: 8px; background: #888; box-shadow: 0 0 0 1px #000; }
.tray .dot.on { background: #1fd61f; }
.smenu { position: fixed; left: 2px; bottom: calc(36px + env(safe-area-inset-bottom)); width: 262px; background: var(--face); box-shadow: var(--out); display: none; z-index: 55; padding: 3px; }
.smenu.open { display: flex; }
.smenu .band { width: 30px; background: linear-gradient(0deg, var(--navy), var(--blue)); color: #fff; writing-mode: vertical-rl; transform: rotate(180deg); font: 400 13px var(--disp); padding: 10px 0; letter-spacing: 1px; flex: none; }
.smenu .band b { color: var(--hl); font-weight: 400; }
.smenu .its { flex: 1; display: grid; }
.sm { display: flex; gap: 10px; align-items: center; padding: 8px 10px; font-size: 15px; text-decoration: none; background: none; border: 0; cursor: pointer; text-align: left; width: 100%; }
.sm .px { width: 24px; height: 24px; flex: none; }
.sm:hover, .sm:focus-visible { background: var(--navy); color: #fff; outline: none; }
.smenu hr { border: 0; border-top: 1px solid var(--sh); border-bottom: 1px solid var(--hi); margin: 3px 2px; }

/* tooltip-balloon toast */
.toast { position: fixed; right: 10px; bottom: calc(48px + env(safe-area-inset-bottom)); background: var(--tip); border: 1px solid #000; padding: 8px 12px; font-size: 14px; z-index: 70; max-width: 320px; box-shadow: 2px 2px 0 rgba(0, 0, 0, .35); }

/* boot + shut down */
#boot { position: fixed; inset: 0; background: #000; z-index: 100; color: #b8b8b8; font: 22px/1.2 var(--mono); padding: 28px 32px; cursor: pointer; white-space: pre-wrap; }
#boot .spl { position: absolute; inset: 0; display: none; place-items: center; align-content: center; gap: 26px; background: #000; }
#boot.s2 .spl { display: grid; }
#boot .spl .mk { width: 150px; height: 150px; padding: 36px 24px; box-shadow: none; }
#boot .spl b { font: 400 28px var(--disp); color: #fff; letter-spacing: 2px; }
#boot .spl b i { color: var(--hl); font-style: normal; font-size: 16px; vertical-align: super; }
#boot .bar { width: 240px; height: 18px; box-shadow: 0 0 0 2px #808080; padding: 3px; }
#boot .bar i { display: block; height: 100%; width: 0; background: repeating-linear-gradient(90deg, var(--blue) 0 9px, transparent 9px 12px); transition: width .7s steps(12); }
#boot.s3 .bar i { width: 100%; }
.off { position: fixed; inset: 0; background: #000; z-index: 100; display: grid; place-items: center; text-align: center; color: #ff9a2e; font: 400 clamp(14px, 2.4vw, 24px)/1.8 var(--disp); padding: 20px; cursor: pointer; }

/* live bits: DEMO tag on the build windows, mempool.exe feed + block lane */
/* title bar colours (Zone-style: every program its own colour) */
.w.c-purple > .tb { background: linear-gradient(90deg, #4a1f8f, #a77bf0); }
.w.c-teal > .tb { background: linear-gradient(90deg, #0b5f6a, #3cc6d4); }
.w.c-green > .tb { background: linear-gradient(90deg, #1b641b, #52c252); }
.w.c-orange > .tb { background: linear-gradient(90deg, #8f4f00, #f0a030); }
.w.c-gold > .tb { background: linear-gradient(90deg, #6e5f00, #d8bf1c); }
.w.c-magenta > .tb { background: linear-gradient(90deg, #7d1a70, #e050c8); }
.w.c-red > .tb { background: linear-gradient(90deg, #7f1010, #e04545); }
.w.c-blue > .tb { background: linear-gradient(90deg, #0a2a9a, #2a7ae0); }
/* fees.cfg (hero) */
.fz { background: #000; box-shadow: var(--in); display: flex; align-items: center; justify-content: center; gap: 30px; padding: 18px; height: 382px; }
.fz canvas { width: 230px; height: 230px; image-rendering: pixelated; flex: none; }
.fl { display: grid; gap: 16px; font: 40px/1 var(--mono); color: #c8c8c8; }
.fl span { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.fl i { width: 20px; height: 20px; flex: none; }
.fl b { font-weight: 400; color: #fff; }
.fl img { width: 30px; height: 30px; object-fit: contain; }
.mp { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 6px; }
.mpl, .mpr { background: #000; box-shadow: var(--in); padding: 8px 10px; min-width: 0; display: flex; flex-direction: column; }
.mph { font: 400 9px/1 var(--disp); color: #fff; display: flex; align-items: center; gap: 8px; margin-bottom: 8px; letter-spacing: .5px; }
.mph .wh { font: 18px/1 var(--mono); }
.lvd { width: 7px; height: 7px; background: var(--err); animation: blink 1s steps(2) infinite; flex: none; }
.feed { height: 196px; overflow: hidden; font: 19px/1.15 var(--mono); color: #c8c8c8; }
.fr { display: grid; grid-template-columns: 46px minmax(0, 1fr) 96px 92px 62px; gap: 8px; align-items: center; padding: 2px 4px; text-decoration: none; color: inherit; white-space: nowrap; }
.fr > * { overflow: hidden; text-overflow: ellipsis; }
.fr:hover { background: #1a1a1a; }
.fr .tg { font: 400 8px/1 var(--disp); text-align: center; padding: 3px 0 2px; color: #000; }
.fr.k-buy .tg { background: var(--ok); } .fr.k-sell .tg { background: var(--err); } .fr.k-launch .tg { background: var(--hl); }
.fr b { color: #fff; font-weight: 400; }
.fr.k-buy .sol { color: var(--ok); } .fr.k-sell .sol { color: var(--err); } .fr.k-launch .sol { color: var(--hl); }
.fr .t { text-align: right; color: var(--dim); }
.fr.new { animation: drop .5s steps(5), hi 1.6s steps(8); }
@keyframes drop { from { transform: translateY(-100%); opacity: 0; } }
@keyframes hi { from { background: #1f3f1f; } to { background: transparent; } }
.fwait { padding: 2px 4px; }
canvas#blk { width: 100%; height: 196px; display: block; image-rendering: pixelated; }
.files .live { grid-column: 1 / -1; background: #000; box-shadow: var(--in); padding: 10px; font: 19px/1.15 var(--mono); color: #c8c8c8; }

.hy { width: 40px; height: 40px; object-fit: contain; flex: none; }
.tki { width: 16px; height: 16px; object-fit: contain; display: inline-block; vertical-align: -2px; margin-right: 6px; }
.tk .hp { font-size: 15px; color: #0a5a4a; } .tk:hover .hp { color: #97fce4; }
.hlg { color: #97fce4; }

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .icons { grid-column: 1 / -1; grid-template-columns: repeat(auto-fill, 78px); justify-content: start; order: 3; }
  .tasks .b98 { width: 130px; flex-basis: 130px; }
}
@media (max-width: 960px) {
  .nav .lk { display: none; }
  .hero { grid-template-columns: minmax(0, 1fr); padding: 22px 14px 6px; gap: 18px; }
  .icons { order: 0; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 74px; overflow-x: auto; justify-content: start; gap: 4px; padding-bottom: 4px; scrollbar-width: none; }
  .icons::-webkit-scrollbar { display: none; }
  .ic { width: 74px; }
  .g3, .g3.tg, .net, .coin, .mp { grid-template-columns: minmax(0, 1fr); }
  canvas#blk { height: 90px; } .feed { height: 172px; }
  .fr { grid-template-columns: 42px minmax(0, 1fr) 84px 52px; } .fr .wl { display: none; }
  .steps { grid-template-columns: minmax(0, 1fr); }
  .arrow { justify-self: center; transform: rotate(90deg); }
  .sec { padding: 44px 14px 4px; }
  .coin { padding: 22px 14px; }
  .tasks { display: none; }
  .term .scr { height: 380px; font-size: 20px; }
  .code { height: 300px; font-size: 17px; }
  .fz { height: auto; gap: 18px; padding: 16px 10px; } .fz canvas { width: 150px; height: 150px; } .fl { font-size: 28px; gap: 10px; } .fl i { width: 14px; height: 14px; } .fl img { width: 22px; height: 22px; }
  .log, .dp .log { height: 150px; }
  .tb { height: 26px; } .ctl button { width: 20px; height: 18px; }
}
@media (max-width: 560px) {
  .two { grid-template-columns: minmax(0, 1fr); }
  .h1 { font-size: 25px; text-shadow: 3px 3px 0 #000; }
  .lede { font-size: 16px; }
  .cta .b98 { flex: 1; }
  .nav { padding: 0 8px; } .logo { font-size: 12px; margin-right: 6px; } .nav .wal { min-width: 0; font-size: 13px; padding: 8px 10px; }
  .files { grid-template-columns: minmax(0, 1fr); }
  .tok .top { flex-direction: column; align-items: flex-start; }
  .donut svg { width: 100px; height: 100px; }
  .tray .clk { display: none; }
}
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }
