/* Workspace Reynar — memakai token warna dari site.css */
body.app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:18px;padding:20px 14px;border-right:1px solid var(--line);background:#EEF1F6;overflow:auto}
.side .brand{padding:0 8px;font-size:16px}
.side nav{display:flex;flex-direction:column;gap:2px}
.side-k{font:500 10.5px "IBM Plex Mono";letter-spacing:.09em;text-transform:uppercase;color:var(--mut2);padding:14px 10px 6px}
.side nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:6px;font-size:14.5px;color:var(--mut);border:1px solid transparent}
.side nav a i{font-style:normal;width:18px;text-align:center;color:var(--mut2)}
.side nav a:hover{background:var(--card);color:var(--ink)}
.side nav a[aria-current=page]{background:var(--card);border-color:var(--line);color:var(--ink);font-weight:600}
.side nav a[aria-current=page] i{color:var(--cu)}
.side-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px;font-size:12.5px;color:var(--mut)}
.side-block{display:flex;gap:8px;align-items:center}
.dot{width:7px;height:7px;border-radius:50%;background:var(--mut2)}.dot.live{background:#1FA463}.dot.bad{background:var(--bad)}
.side .ca-chip{justify-content:flex-start}
.back{text-decoration:underline;text-underline-offset:4px}

.main{padding:28px clamp(16px,3vw,40px) 80px;min-width:0}
.view{display:flex;flex-direction:column;gap:16px;max-width:1280px}
.vh{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:4px}
.crumb{font:500 11px "IBM Plex Mono";letter-spacing:.08em;text-transform:uppercase;color:var(--mut2)}
.vh h1{font-size:34px;letter-spacing:-.03em;font-weight:600;margin-top:6px}
.vh-note{max-width:520px;color:var(--mut);font-size:14.5px;line-height:1.55}

.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px;min-width:0}
.card-h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.card-h b{font-size:15px}
.sub{display:block;color:var(--mut2);font-size:12.5px}
.fine{font-size:12.5px;color:var(--mut);line-height:1.6;margin-top:10px}
.tag3{font:500 11px "IBM Plex Mono";color:var(--mut);background:var(--line2);padding:5px 8px;border-radius:5px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--bg)}
.seg button{border:0;background:transparent;padding:7px 12px;font:500 12.5px "IBM Plex Mono";color:var(--mut)}
.seg button+button{border-left:1px solid var(--line)}
.seg button[aria-selected=true]{background:var(--navy);color:#fff}
.seg.sm button{padding:6px 9px;font-size:11.5px}
select,input{font:inherit;font-size:14px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:7px;padding:9px 11px;min-height:40px}
select:focus,input:focus{outline:2px solid var(--navy);outline-offset:1px}

/* overview */
.ov{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.ov-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.mk-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.mk-id{display:flex;gap:14px;align-items:center}
.mk-sym{width:52px;height:52px;border-radius:10px;background:var(--navy);color:#fff;display:grid;place-items:center;font:600 13px "IBM Plex Mono"}
.mk-id b{font-size:20px;letter-spacing:-.01em}
.mk-px{text-align:right}.mk-px .px{font-size:38px;font-weight:600;letter-spacing:-.03em}
.dual{display:grid;grid-template-columns:1fr 1fr .8fr;gap:0}
.dual-c{display:flex;flex-direction:column;gap:4px;padding:4px 16px}
.dual-c+.dual-c{border-left:1px solid var(--line)}
.dual-c:first-child{padding-left:0}
.dual-c b{font-size:24px;font-weight:600;letter-spacing:-.02em}
.rc-btn{align-self:flex-start;margin-top:6px;border:1px solid var(--line);background:var(--bg);border-radius:5px;font:500 11.5px "IBM Plex Mono";padding:4px 8px;color:var(--ink)}
.rc-btn:hover{border-color:var(--mut2)}
.chart{position:relative;height:300px}.chart.tall{height:360px}
.chart svg{width:100%;height:100%;display:block;overflow:visible}
.ov-list{position:sticky;top:20px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;padding:0}
.ov-list .card-h{padding:16px 16px 0}
.search{display:flex;flex-direction:column;gap:8px;padding:0 16px 12px;border-bottom:1px solid var(--line)}
.mk-list{overflow:auto;flex:1}
.mk-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line2);cursor:pointer;width:100%;text-align:left;background:none;border-left:0;border-right:0;border-top:0;font:inherit;color:inherit}
.mk-row:hover{background:var(--bg)}
.mk-row[aria-selected=true]{background:#EEF2F8;box-shadow:inset 3px 0 0 var(--cu)}
.mk-row .t{font:600 12.5px "IBM Plex Mono"}
.mk-row .n{font-size:12.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-row .p{text-align:right;font-variant-numeric:tabular-nums;font-size:14px}
.mk-row .s{display:block;font:500 10px "IBM Plex Mono";color:var(--mut2);text-transform:uppercase;letter-spacing:.05em}
.mk-row .s.o{color:var(--ok)}

/* record */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:12px;background:var(--card);overflow:hidden}
.kpis>div{padding:16px 18px}.kpis>div+div{border-left:1px solid var(--line)}
.kpis b{display:block;font-size:26px;font-weight:600;letter-spacing:-.02em}
.kpis span{font-size:12.5px;color:var(--mut)}
.kpis.inline{margin-top:14px}
.tw.flat{margin-top:6px;border-radius:8px}
.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rules p{font-size:14px;color:var(--mut);line-height:1.55;margin-top:6px}
tr.open-row td{background:#FAFBFC}
.fp-btn{border:0;background:none;padding:0;font:500 12px "IBM Plex Mono";color:var(--mut);text-decoration:underline dotted;text-underline-offset:3px}
.rc-detail{font:500 12px/1.7 "IBM Plex Mono";white-space:pre-wrap;word-break:break-all;color:var(--ink)}

/* verify */
.vf{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.field{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--mut)}
.field.grow{flex:1;min-width:240px}
.vf-steps{display:flex;flex-direction:column;gap:10px}
.vf-step{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:start;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.vf-step .n{width:24px;height:24px;border-radius:50%;background:var(--line2);display:grid;place-items:center;font:600 11px "IBM Plex Mono"}
.vf-step.ok .n{background:var(--okbg);color:var(--ok)}.vf-step.bad .n{background:var(--badbg);color:var(--bad)}
.vf-step b{font-size:14.5px}
.vf-step code{display:block;font-size:12px;color:var(--mut);margin-top:4px;word-break:break-all}

/* liquidity & technicals */
.pick{display:flex;gap:10px;flex-wrap:wrap}
.lq{height:420px;position:relative}
.lq svg{width:100%;height:100%}
.tk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);margin-top:14px}
.tk-grid>div{padding:14px 14px 4px;border-right:1px solid var(--line)}
.tk-grid>div:last-child{border-right:0}
.tk-grid b{display:block;font-size:22px;font-weight:600;letter-spacing:-.02em;margin:4px 0}
.tk-grid p{font-size:12.5px;color:var(--mut);line-height:1.5}

/* portfolio */
.pf-form{display:flex;gap:12px;align-items:end;flex-wrap:wrap}
.pf-sum{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:12px;margin-bottom:10px}
.pf-sum b{display:block;font-size:30px;letter-spacing:-.02em;margin-top:4px}

/* mcp */
.mcp{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;align-items:start}
.url-row{display:flex;gap:10px;align-items:center;margin:10px 0 12px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.url-row code{flex:1;font-size:14px;overflow:hidden;text-overflow:ellipsis}
.mcp .tabs{margin-top:18px}
.tools-list{display:flex;flex-direction:column;margin-top:8px}
.tools-list div{padding:10px 0;border-bottom:1px solid var(--line2)}
.tools-list code{font-size:12.5px;font-weight:600}
.tools-list p{font-size:13px;color:var(--mut);line-height:1.5;margin-top:2px}
.asks{margin:8px 0 0;padding-left:18px;color:var(--mut);font-size:14px;line-height:1.7}

/* docs */
.docs{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:start}
.docs-nav{position:sticky;top:20px;display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.docs-nav a{padding:7px 10px;border-radius:6px;color:var(--mut)}.docs-nav a:hover{background:var(--card);color:var(--ink)}
.prose{padding:28px 32px;max-width:820px}
.prose h2{font-size:21px;letter-spacing:-.02em;font-weight:600;margin:28px 0 8px}.prose h2:first-child{margin-top:0}
.prose p{font-size:15.5px;line-height:1.7;color:#2A3448}
.prose code{font-size:13px;background:var(--line2);padding:1px 5px;border-radius:4px}
.prose a{text-decoration:underline;text-underline-offset:3px}
table.small{min-width:0;font-size:13px}table.small td{padding:9px 12px}

.tip{position:fixed;z-index:50;pointer-events:none;background:var(--navy);color:#fff;font:500 12px/1.5 "IBM Plex Mono";padding:7px 9px;border-radius:6px;white-space:pre;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.tabbar{display:none}

@media (max-width:1100px){.ov{grid-template-columns:1fr}.ov-list{position:static;max-height:520px}.mcp{grid-template-columns:1fr}}
@media (max-width:860px){
  body.app{grid-template-columns:1fr}
  .side{position:fixed;inset:0 auto 0 0;width:270px;z-index:40;transform:translateX(-102%);transition:transform .2s;visibility:hidden}
  .side.open{transform:none;visibility:visible;box-shadow:20px 0 40px -20px rgba(0,0,0,.3)}
  .mk-px{text-align:left}
  .main{padding:18px 16px 96px}
  .vh h1{font-size:28px}
  .dual{grid-template-columns:1fr}.dual-c{padding:12px 0}.dual-c+.dual-c{border-left:0;border-top:1px solid var(--line)}
  .kpis{grid-template-columns:1fr 1fr}.kpis>div:nth-child(3){border-left:0}.kpis>div:nth-child(n+3){border-top:1px solid var(--line)}
  .rules,.tk-grid{grid-template-columns:1fr 1fr}
  .docs{grid-template-columns:1fr}.docs-nav{position:static;flex-direction:row;flex-wrap:wrap}.prose{padding:20px}
  .chart{height:240px}.lq{height:340px}
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--mut);background:none;border:0;padding:6px 0;border-radius:8px}
  .tabbar i{font-style:normal;font-size:17px}
  .tabbar [aria-current=page]{color:var(--ink);background:var(--line2);font-weight:600}
  .mk-px .px{font-size:30px}
}
@media (max-width:520px){.rules,.tk-grid{grid-template-columns:1fr}.tk-grid>div{border-right:0;border-bottom:1px solid var(--line)}}

/* record: holder desk + jangkar */
.rc-top{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.h-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.holder.on{border-color:var(--cu);box-shadow:inset 3px 0 0 var(--cu)}
.an-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line2);font-size:13px}
.an-row .fp{font-size:12px}
.an-row button{border:1px solid var(--line);background:var(--bg);border-radius:5px;font:500 11px "IBM Plex Mono";padding:4px 7px}
tr.sealed-row td{background:#FFF8F3}
@media (max-width:860px){.rc-top{grid-template-columns:1fr}}

/* ===== lapisan premium (menyamakan dengan landing "Arctic Ledger") ===== */
.side{background:rgba(255,255,255,.72);backdrop-filter:blur(12px);border-right:1px solid var(--line2)}
.side .brand{font-size:17px}
.side-k{font:500 11px "Switzer",sans-serif;letter-spacing:.02em;text-transform:none;color:var(--mut2);padding:18px 10px 6px}
.side nav a{border-radius:10px;font-size:14.5px}
.side nav a:hover{background:var(--bg)}
.side nav a[aria-current=page]{background:var(--bg);border-color:var(--line);box-shadow:0 1px 2px rgba(10,15,28,.05)}
.vh{border-bottom:1px solid var(--line2);padding-bottom:20px}
.crumb{font:500 12px "Switzer",sans-serif;letter-spacing:.01em;text-transform:none;color:var(--mut2)}
.vh h1{font-size:40px;letter-spacing:-.045em;font-weight:500}
.card{border-radius:var(--r2);border-color:var(--line);box-shadow:var(--shadow);padding:20px}
.card-h b{font-weight:500;font-size:15.5px;letter-spacing:-.01em}
.seg{border-radius:999px;background:var(--bg)}
.seg button{font:500 12.5px "Switzer",sans-serif;padding:7px 14px}
.seg button[aria-selected=true]{background:var(--navy);color:#fff;border-radius:999px}
.seg button+button{border-left:0}
.mk-sym{border-radius:14px;background:linear-gradient(160deg,#1A2A4F,#0B1222)}
.mk-id b{font-weight:500;font-size:22px;letter-spacing:-.02em}
.mk-px .px{font-weight:500;letter-spacing:-.045em}
.dual-c b{font-weight:500;letter-spacing:-.03em;font-size:26px}
.kpis{border-radius:var(--r2);box-shadow:var(--shadow)}
.kpis b{font-weight:500;letter-spacing:-.035em;font-size:28px}
.tk-grid b{font-weight:500;letter-spacing:-.03em}
.rc-btn{border-radius:999px;padding:4px 10px}
select,input{border-radius:10px}
.mk-row[aria-selected=true]{background:#F7F1EC;box-shadow:inset 2px 0 0 var(--cu)}
.prose h2{font-weight:500;letter-spacing:-.03em}
.tabbar{background:rgba(255,255,255,.9)}