/* FULCRA — aplikasi */
.app .topnav{display:grid;grid-template-columns:1fr auto 1fr;gap:20px}
.app .tl{display:flex;align-items:center;gap:12px}
.app .tr{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.tabs{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:11px;background:#070708}
.tabs a{padding:7px 16px;border-radius:8px;font-size:14px;color:var(--mute)}
.tabs a:hover{color:var(--ink)}
.tabs a.on{background:#18181b;color:#fff}
.view{max-width:var(--max);margin:0 auto;padding:110px var(--gut) 90px;min-height:80vh}
.vh{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.vh h1{font-size:clamp(30px,3.4vw,44px);font-weight:600;letter-spacing:-.035em;line-height:1.05;margin-top:10px}
.vh h1 span{color:#6f6f75}
.vh p{color:var(--mute);margin-top:10px;max-width:560px}
.panel{border:1px solid var(--line);border-radius:16px;background:#060607}
.ph{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line);gap:12px}
.ph h3{font-size:16px;font-weight:600}
.empty{padding:60px 20px;text-align:center;color:var(--mute)}
.empty .btn{margin-top:16px}
.wbtn-on{font-family:var(--mono);font-size:13px}

/* ---------- pita angka ---------- */
.band{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#060607}
.band>div{padding:20px 22px;border-right:1px solid var(--line);min-width:0}
.band>div:last-child{border-right:0}
.band small{display:block;font-size:13px;color:var(--mute)}
.band b{display:block;font-size:28px;font-weight:600;letter-spacing:-.03em;margin-top:8px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.band em{display:block;font-style:normal;font:400 12px var(--mono);color:var(--dim);margin-top:8px}

/* ---------- explore ---------- */
.tools{display:flex;gap:10px;margin:22px 0 18px;flex-wrap:wrap}
.search{flex:1;min-width:220px;height:44px;border:1px solid var(--line2);border-radius:10px;background:#060607;padding:0 14px;outline:none}
.search:focus{border-color:#4a4a52}
.pills{display:flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:10px}
.pills button{height:36px;padding:0 14px;border-radius:7px;font-size:14px;color:var(--mute)}
.pills button.on{background:#18181b;color:#fff}
select.sel{height:44px;border:1px solid var(--line2);border-radius:10px;background:#060607;padding:0 34px 0 14px;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#888 50%),linear-gradient(135deg,#888 50%,transparent 50%);background-position:calc(100% - 18px) 19px,calc(100% - 13px) 19px;background-size:5px 5px;background-repeat:no-repeat}
.cgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

/* ---------- create ---------- */
.create{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:24px;align-items:start}
.step{border:1px solid var(--line);border-radius:16px;background:#060607;padding:24px;margin-bottom:16px}
.step h3{font-size:17px;font-weight:600;display:flex;align-items:center;gap:10px}
.step h3 i{font:500 11px var(--mono);font-style:normal;color:var(--dim);border:1px solid var(--line2);border-radius:6px;padding:3px 6px}
.cats{display:flex;gap:6px;margin:18px 0 10px;flex-wrap:wrap}
.cats button{height:30px;padding:0 11px;border-radius:8px;border:1px solid var(--line2);font-size:13px;color:var(--mute)}
.cats button.on{background:#f2f2f2;color:#000;border-color:#f2f2f2}
.mtable{border:1px solid var(--line);border-radius:12px;max-height:330px;overflow:auto}
.mrow{display:grid;grid-template-columns:minmax(0,1.6fr) 1fr .8fr 1fr .6fr;gap:10px;align-items:center;padding:11px 14px;border-bottom:1px solid #121214;cursor:pointer;font-size:14px}
.mrow:last-child{border-bottom:0}
.mrow:hover{background:#0c0c0e}
.mrow.on{background:#121216;box-shadow:inset 3px 0 0 #f2f2f2}
.mrow b{font-weight:600;display:block} .mrow small{color:var(--mute);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.mrow .r{text-align:right} .mrow .mono{font-size:12px;color:var(--mute)}
.mhead{position:sticky;top:0;background:#0a0a0b;z-index:1;cursor:default;font:500 11px var(--mono);color:var(--dim);letter-spacing:.06em;text-transform:uppercase}
.mhead:hover{background:#0a0a0b}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.f{display:flex;flex-direction:column;gap:7px}
.f.full{grid-column:1/-1}
.f label{font-size:13px;color:var(--mute);display:flex;justify-content:space-between}
.f label em{font-style:normal;color:var(--dim)}
.f input,.f textarea{height:44px;border:1px solid var(--line2);border-radius:10px;background:#000;padding:0 13px;outline:none}
.f textarea{height:88px;padding:11px 13px;resize:vertical}
.f input:focus,.f textarea:focus{border-color:#4a4a52}
.f .err{font-size:12px;color:var(--short-ink);min-height:0}
.drop{border:1px dashed #33333a;border-radius:12px;min-height:120px;display:flex;align-items:center;justify-content:center;gap:16px;color:var(--mute);font-size:14px;cursor:pointer;padding:16px;text-align:center}
.drop:hover{border-color:#55555c}
.drop img{width:84px;height:84px;border-radius:14px;object-fit:cover}
.optrow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.optrow .seg{margin-top:8px}
.preview{position:sticky;top:96px;display:flex;flex-direction:column;gap:14px}
.summary{border:1px solid var(--line);border-radius:16px;background:#060607;padding:6px 20px 20px}
.summary dl{display:grid;grid-template-columns:auto 1fr}
.summary dt,.summary dd{padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.summary dt{color:var(--mute)} .summary dd{text-align:right;font-weight:500}
.summary .btn{width:100%;margin-top:18px;height:48px}
.summary .note{font-size:13px;color:var(--mute);margin-top:12px;text-align:center}
.seg{display:flex;gap:6px}
.seg button{flex:1;height:40px;border:1px solid var(--line2);border-radius:9px;font-weight:600;font-size:14px;color:var(--mute)}
.seg.sm button{font:500 13px var(--mono);height:36px}
.seg button.on{background:#f2f2f2;color:#000;border-color:#f2f2f2}
.seg button.on.l{background:var(--long);color:#fff;border-color:var(--long)}
.seg button.on.s{background:var(--short);color:#fff;border-color:var(--short)}
.seg button:disabled{opacity:.3;cursor:not-allowed}
.lbl2{font-size:13px;color:var(--mute);display:flex;justify-content:space-between;margin-top:16px}
.lbl2 em{font-style:normal;color:var(--dim)}

/* ---------- halaman koin ---------- */
.chead{display:flex;gap:18px;align-items:center}
.chead img{width:76px;height:76px;border-radius:18px;object-fit:cover;border:1px solid var(--line2)}
.chead h1{font-size:clamp(28px,3.2vw,42px);font-weight:600;letter-spacing:-.035em;line-height:1;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.chead h1 span{font-size:.5em;color:var(--mute);font-weight:500;letter-spacing:0}
.chead .tags{display:flex;gap:8px;margin-top:10px;align-items:center;flex-wrap:wrap}
.chead .tags .mono{font-size:11px;color:var(--dim)}
.carow{display:flex;gap:10px;margin:22px 0;flex-wrap:wrap;align-items:center}
.ca{display:flex;align-items:center;border:1px solid var(--line2);border-radius:10px;height:44px;max-width:100%;min-width:0;overflow:hidden}
.ca span{padding:0 12px;font:400 13px var(--mono);color:var(--mute);border-right:1px solid var(--line2);height:100%;display:flex;align-items:center}
.ca code{padding:0 12px;font:400 13px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.ca button{flex:none;height:100%;padding:0 14px;border-left:1px solid var(--line2);font-size:13px}
.ca button:hover{background:#121214}
.cgrid2{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;margin-top:16px;align-items:start}
.chartbox{height:420px;position:relative}
.chartbox canvas{width:100%;height:100%;display:block}
.chartbar{display:flex;gap:4px}
.chartbar button{height:30px;padding:0 10px;border-radius:7px;font:500 12px var(--mono);color:var(--mute)}
.chartbar button.on{background:#18181b;color:#fff}
.kv{display:grid;grid-template-columns:auto 1fr;padding:4px 20px 12px}
.kv dt,.kv dd{padding:11px 0;border-bottom:1px solid #121214;font-size:14px}
.kv dt{color:var(--mute)} .kv dd{text-align:right;font-weight:500}
.kv dt:nth-last-child(2),.kv dd:last-child{border-bottom:0}
.prose{padding:18px 20px;color:var(--mute);font-size:14px;display:flex;flex-direction:column;gap:10px}
.prose b{color:var(--ink);font-weight:600}
.rcpt{width:100%;border-collapse:collapse;font-size:14px}
.rcpt th{font:500 11px var(--mono);color:var(--dim);letter-spacing:.06em;text-transform:uppercase;text-align:left;padding:12px 20px;border-bottom:1px solid var(--line)}
.rcpt td{padding:12px 20px;border-bottom:1px solid #121214;vertical-align:middle}
.rcpt tr:last-child td{border-bottom:0}
.rcpt .r{text-align:right}
.rcpt .tx{font:400 12px var(--mono);color:var(--dim)}
.kind{display:inline-flex;align-items:center;gap:7px;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.kind i{width:7px;height:7px;border-radius:2px;transform:rotate(45deg);background:#666}
.kind.fee i{background:#8b8b91} .kind.open i{background:#ededed} .kind.lock i,.kind.payout i,.kind.retire i{background:var(--long)} .kind.guard i,.kind.liq i{background:var(--short)} .kind.launch i{background:#d8c37a}

/* ---------- stats ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.lrow{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 20px;border-bottom:1px solid #121214}
.lrow:last-child{border-bottom:0}
.lrow:hover{background:#0a0a0b}
.lrow img{width:28px;height:28px;border-radius:8px}
.lrow b{font-weight:600;font-size:14px} .lrow small{display:block;font:400 11px var(--mono);color:var(--dim)}
.netbar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:#141416;margin-top:6px;min-width:120px}
.netbar i{display:block;height:100%}

/* ---------- docs ---------- */
.docs{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px}
.dnav{display:flex;flex-direction:column;gap:2px;position:sticky;top:96px;align-self:start}
.dnav a{padding:10px 14px;border-radius:9px;color:var(--mute);font-size:14px}
.dnav a.on{background:#121214;color:#fff}
.doc{max-width:760px}
.doc h1{font-size:40px;font-weight:600;letter-spacing:-.035em}
.doc h2{font-size:22px;font-weight:600;margin:38px 0 10px;letter-spacing:-.02em}
.doc p,.doc li{color:#b5b5ba;font-size:16px;line-height:1.65}
.doc p{margin-top:12px}
.doc ol,.doc ul{padding-left:22px;margin-top:12px;display:flex;flex-direction:column;gap:10px}
.doc b{color:#fff}
.doc table{width:100%;border-collapse:collapse;margin-top:16px;font-size:14px}
.doc td,.doc th{border-bottom:1px solid var(--line);padding:11px 8px;text-align:left}
.doc th{font:500 11px var(--mono);color:var(--dim);letter-spacing:.06em;text-transform:uppercase}

/* ---------- modal dompet ---------- */
.modal{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.66);backdrop-filter:blur(6px);display:grid;place-items:center;padding:16px}
.modal[hidden]{display:none}
.mbox{width:100%;max-width:420px;border:1px solid var(--line2);border-radius:18px;background:#0a0a0b;padding:22px}
.mbox h3{font-size:18px;font-weight:600}
.mbox p{color:var(--mute);font-size:14px;margin-top:6px}
.mbox pre{white-space:pre-wrap;word-break:break-all;font:400 12px/1.6 var(--mono);color:#c9c9ce;background:#000;border:1px solid var(--line);border-radius:10px;padding:14px;margin-top:14px;max-height:260px;overflow:auto}
.wlist{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.wlist button{display:flex;align-items:center;gap:12px;height:52px;padding:0 14px;border:1px solid var(--line2);border-radius:12px;text-align:left;font-weight:500}
.wlist button:hover{border-color:#4a4a52;background:#111113}
.wlist img{width:28px;height:28px;border-radius:7px}
.mact{display:flex;gap:8px;margin-top:16px} .mact .btn{flex:1}

/* ---------- tab bawah HP ---------- */
.mtabs{display:none}

@media (max-width:1100px){
  .cgrid{grid-template-columns:1fr 1fr}
  .create{grid-template-columns:1fr} .preview{position:static}
  .cgrid2{grid-template-columns:1fr}
}
@media (max-width:760px){
  .app .topnav{grid-template-columns:1fr auto}
  .tabs{display:none} .tr .soc{display:none}
  .view{padding:84px var(--gut) 100px}
  .cgrid{grid-template-columns:1fr}
  .band{grid-template-columns:1fr 1fr} .band>div:nth-child(2n){border-right:0} .band>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .band b{font-size:22px}
  .band>div{padding:16px}
  .two{grid-template-columns:1fr}
  .fgrid,.optrow{grid-template-columns:1fr}
  .mrow{grid-template-columns:minmax(0,1.4fr) 1fr .9fr}
  .mrow>:nth-child(4),.mrow>:nth-child(5){display:none}
  .step{padding:18px}
  .chartbox{height:300px}
  .rcpt th:nth-child(4),.rcpt td:nth-child(4){display:none}
  .rcpt td,.rcpt th{padding:11px 12px}
  .docs{grid-template-columns:1fr} .dnav{position:static;flex-direction:row;overflow:auto}
  .foot{padding-bottom:96px}
  .mtabs{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(0,0,0,.88);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .mtabs a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--mute);padding:6px 0;border-radius:10px}
  .mtabs a.on{color:#fff;background:#141416}
  .mtabs svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
}
.rcpt .tx a{color:var(--mute)} .rcpt .tx a:hover{color:var(--ink)}
.kv dd a{color:var(--ink)} .kv dd a:hover{color:#fff}
.simnote{font:500 12px var(--mono);letter-spacing:.06em;color:#d8c37a;align-self:center}
@media (max-width:760px){.rcpt td:nth-child(1){width:1%;white-space:nowrap}.rcpt td{font-size:13px}.rcpt .kind{font-size:10px}}