.page { background: #050a16; min-height: 100dvh; }
.pageshade { position: fixed; inset: 0; z-index: 0; background: linear-gradient(90deg, rgba(5,10,22,.42), rgba(5,10,22,.8) 30%, rgba(5,10,22,.8) 66%, rgba(5,10,22,.3)); pointer-events: none; }
.doc, .foot { position: relative; z-index: 1; }
.page .bar { position: sticky; background: linear-gradient(180deg, rgba(5, 10, 22, .92), rgba(5, 10, 22, 0)); }
.page .bar .mark { margin-right: auto; }
.tnav2 { display: flex; gap: 18px; margin-right: 8px; font-size: 13px; color: var(--muted); } .tnav2 a:hover { color: var(--text); }
.doc { max-width: 640px; margin: 0 auto; padding: 56px 24px 70px; }
.doc h1 { font-size: 38px; } .doc .lede { margin-top: 14px; font-size: 16px; color: #c3d5ee; }
.doc h2 { margin-top: 42px; font-size: 21px; color: var(--text); }
.doc p { margin-top: 12px; font-size: 14.5px; color: #aabfdd; line-height: 1.6; }
.doc .soon { margin-top: 8px; font-size: 13px; color: var(--accent); }
.cabox { margin-top: 24px; font-size: 13.5px; color: var(--muted); } .cabox button { display: block; margin-top: 6px; font-size: 13px; color: var(--accent); word-break: break-all; text-align: left; }
.code { position: relative; margin-top: 22px; padding: 16px 70px 16px 16px; border-radius: 12px; background: rgba(4, 9, 20, .8); box-shadow: inset 0 0 0 1px var(--line); overflow-x: auto; }
.code code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: #d6e5fb; white-space: pre-wrap; word-break: break-all; }
.code .cp { position: absolute; right: 10px; top: 10px; height: 28px; padding: 0 11px; border-radius: 14px; font-size: 12px; color: #07101f; background: var(--text); }
.tool { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14px; } .tool b { font-weight: 400; color: var(--accent); font-stretch: 110%; } .tool span { color: #aabfdd; }
.asks { margin: 12px 0 0; padding: 0; list-style: none; font-size: 15px; color: #c3d5ee; } .asks li { padding: 7px 0; }
@media (max-width: 600px) { .doc { padding-top: 34px; } .doc h1 { font-size: 30px; } .tool { grid-template-columns: 1fr; gap: 3px; } .tnav2 { display: none; } }

.cmp { --x: 50%; position: relative; margin-top: 18px; aspect-ratio: 1; overflow: hidden; border-radius: 4px; user-select: none; }
.cmp img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.cmpL { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--x)) 0 0); }
.cmpH { position: absolute; top: 0; bottom: 0; left: var(--x); width: 1.5px; background: var(--accent); box-shadow: 0 0 12px rgba(255, 194, 122, .8); pointer-events: none; }
.cmp input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: ew-resize; margin: 0; }
.cmpA, .cmpB { position: absolute; bottom: 12px; padding: 4px 10px; border-radius: 12px; font-size: 12px; color: var(--text); background: rgba(5, 10, 22, .78); pointer-events: none; } .cmpA { left: 12px; } .cmpB { right: 12px; }

.lnk { color: var(--blue); }

.tdlist { margin-top: 26px; display: grid; gap: 54px; }
.td { position: relative; }
.tdp { --x: 0%; position: relative; aspect-ratio: 1; overflow: hidden; border-radius: 4px; background: var(--ink3); touch-action: pan-y; cursor: ew-resize; user-select: none; }
.tdp img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; image-rendering: auto; }
.tdp .old { clip-path: inset(0 calc(100% - var(--x)) 0 0); }
.tdp .bar2 { position: absolute; top: 0; bottom: 0; left: var(--x); width: 1.5px; background: var(--blue); box-shadow: 0 0 12px rgba(130, 190, 255, .8); pointer-events: none; opacity: 0; transition: opacity .25s; }
.tdp.live .bar2 { opacity: 1; }
.tdp .lab { position: absolute; bottom: 10px; padding: 3px 9px; border-radius: 11px; font-size: 12px; color: var(--text); background: rgba(5, 10, 22, .76); pointer-events: none; opacity: 0; transition: opacity .25s; }
.tdp.live .lab { opacity: 1; } .tdp .la { left: 10px; } .tdp .lb { right: 10px; }
.tdh { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; margin-top: 12px; }
.tdh h2 { margin: 0; font-size: 21px; color: var(--text); } .tdh .when { font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.tdn { margin-top: 7px !important; font-size: 14.5px; color: #c3d5ee !important; }
.tdf { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 9px; font-size: 13px; color: var(--muted); }
.tdf .tk { color: var(--accent); } .tdf a.open { color: var(--blue); margin-left: auto; }
.kinds2 { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 22px; }
.kinds2 button { height: 28px; padding: 0 12px; border-radius: 14px; font-size: 12.5px; color: #a6bcda; background: rgba(8, 16, 34, .6); box-shadow: inset 0 0 0 1px rgba(190, 215, 250, .14); }
.kinds2 button.on { color: #07101f; background: var(--text); box-shadow: none; }

.bt { width: 100%; margin: 18px 0 10px; border-collapse: collapse; font-size: 14px; font-variant-numeric: lining-nums; }
.bt th { padding: 0 0 8px; text-align: left; font-weight: 400; color: var(--muted); font-size: 13px; }
.bt td { padding: 7px 0; border-top: 1px solid var(--line); color: #c7d8f0; }
.bt th:nth-child(n+3), .bt td:nth-child(n+3) { text-align: right; }
.bt td:nth-child(2) { color: var(--accent); }
.btn { font-size: 14px; color: var(--muted); }

/* the board of agents */
.agcount { margin-top: 12px; font-size: 13px; color: var(--accent); }
.agboard { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 12px; margin-top: 12px; }
.agc { display: block; min-width: 0; }
.agc img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; border-radius: 4px; background: rgba(120, 170, 240, .08); transition: opacity .2s; }
.agc:hover img { opacity: .82; }
.agn { display: block; margin-top: 8px; font-size: 14px; color: var(--text); }
.agm { display: block; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ags { display: block; margin-top: 3px; font-size: 12px; line-height: 1.32; color: #aabfdd; }
.tk a:hover { color: var(--text); }
@media (max-width: 600px) { .agboard { grid-template-columns: repeat(2, 1fr); } }

.paystats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
.paystats b { display: block; font-weight: 300; font-size: 19px; color: var(--text); } .paystats span { display: block; margin-top: 2px; font-size: 12.5px; color: var(--muted); }
.paystats .lnk { grid-column: 1 / -1; font-size: 13px; }
.doc .soon .pill { margin-top: 4px; }
@media (max-width: 600px) { .paystats { grid-template-columns: 1fr; } }