/* ============================================================
   CRC-30 · Explorer 专用样式
   沿用主站灰阶与发丝线。编码原则与 Blindsats Explorer 一致：
   不靠色相。费率用 8 格轨道 + 斜线密度；进出方向用实心/空心圆点。
   ============================================================ */

.xs-main{padding:34px 0 80px}

/* ---------------- 搜索 ---------------- */
.xs-search{position:relative;display:flex;gap:8px;margin:0 0 6px}
.xs-search input{
  flex:1;min-width:0;height:52px;padding:0 42px 0 16px;
  background:var(--surface-2);border:1px solid var(--line);color:var(--ink);
  font:400 15px/1 var(--font);letter-spacing:.01em;outline:none;
}
.xs-search input::placeholder{color:var(--ink-4)}
.xs-search input:focus{border-color:var(--line-strong);background:var(--surface-3)}
#xs-x{
  position:absolute;left:auto;right:104px;top:0;width:44px;height:52px;
  background:none;border:0;color:var(--ink-4);cursor:pointer;font-size:15px;display:none;
}
#xs-x:hover{color:var(--ink-1)}
.xs-search .btn{flex:0 0 auto;height:52px;padding:0 22px}

.xs-say{
  max-height:0;overflow:hidden;opacity:0;transition:max-height .2s,opacity .2s,margin .2s;
  font:400 13px/1.5 var(--font);color:var(--ink-2);
}
.xs-say.on{max-height:80px;opacity:1;margin:0 0 16px;padding:11px 14px;
  border:1px solid var(--line);border-left:2px solid var(--line-strong);background:var(--surface)}
/* 私钥警告是唯一用到语义色的地方：这里必须一眼可辨，不能只靠亮度 */
.xs-say.danger{border-left-color:var(--key-red);color:var(--ink-1)}

/* ---------------- 栅格 ---------------- */
.xgrid2{display:grid;grid-template-columns:1fr 380px;gap:20px;align-items:start}
.xcol{display:grid;gap:20px}
@media(max-width:900px){.xgrid2{grid-template-columns:1fr}}

/* ---------------- 面板 ---------------- */
.xp-panel{border:1px solid var(--line);background:var(--surface);padding:18px}
.xp-panel>.label{display:block;margin:0 0 14px;color:var(--ink-3);letter-spacing:.16em}
.xp{margin:0 0 12px;font:400 14px/1.72 var(--font);color:var(--ink-2);max-width:66ch}
.xp:last-child{margin-bottom:0}
.xp b{color:var(--ink);font-weight:600}
.xol{margin:0 0 12px;padding-left:20px;font:400 14px/1.72 var(--font);color:var(--ink-2)}
.xol li{margin:0 0 7px}
.xol li::marker{color:var(--ink-5)}

/* ---------------- 事实网格 ---------------- */
.xfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;
  background:var(--line-soft);border:1px solid var(--line-soft)}
.xfact{background:var(--bg-1);padding:12px 14px;min-width:0}
.xfact .label{color:var(--ink-4);letter-spacing:.14em;margin:0 0 6px}
.xfact-v{font:600 14px/1.4 var(--font);color:var(--ink);word-break:break-word}
.xfact-v .dim{font-weight:400}
.xok{color:var(--ink-hi)}
.xwrap{word-break:break-all;line-height:1.5}

/* ---------------- 区块格 ---------------- */
.xblocks{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--line-soft)}
.xblock{background:var(--bg-1);padding:13px 14px;text-decoration:none;color:inherit;display:grid;gap:7px;
  transition:background .12s}
.xblock:hover{background:var(--surface-3)}
.xblock-h{font:600 15px/1 var(--mono);color:var(--ink)}

/* 8 格费率轨：填充格数 = 档位，data-n 决定斜线密度。
   单色里亮度最多可靠区分 4 级，所以再加一层密度编码。 */
.xrail{display:flex;gap:2px;height:8px;align-items:stretch}
.xrail i{flex:1;background:var(--tick-off);display:block}
.xrail i.on{background:var(--ink-2)}
.xrail[data-n="7"] i.on,.xrail[data-n="8"] i.on{background:var(--ink)}
.xrail[data-n="1"] i.on{background:repeating-linear-gradient(45deg,var(--ink-3) 0 2px,transparent 2px 4px)}
.xrail[data-n="2"] i.on{background:repeating-linear-gradient(45deg,var(--ink-3) 0 3px,transparent 3px 6px)}

/* ---------------- 手续费 ---------------- */
.xfees{display:grid;gap:1px;background:var(--line-soft)}
.xfee{background:var(--bg-1);padding:11px 14px;display:grid;gap:7px}
.xfee .label{color:var(--ink-4);letter-spacing:.14em}
.xfee-v{font:600 15px/1 var(--mono);color:var(--ink)}

/* ---------------- 协议格 ---------------- */
.xprotos{display:grid;gap:1px;background:var(--line-soft)}
.xproto{background:var(--bg-1);padding:13px 14px;text-decoration:none;color:inherit;
  display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center}
a.xproto:hover{background:var(--surface-3)}
.xproto.is-static{opacity:.62;cursor:default}
.io-glyph{grid-row:1/3;font:400 15px/1 var(--mono);color:var(--ink-3);
  width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--line)}
/* 三种协议的边框线型：实线 = 收款方写在链上；虚线 = 不连续（离线/推导） */
.xproto[data-p="crc30"] .io-glyph{border-style:solid}
.xproto[data-p="runes"] .io-glyph{border-style:dashed}
.xproto[data-p="brc20"] .io-glyph{border-style:dotted}
.xproto-n{font:600 14px/1.2 var(--font);color:var(--ink)}
.xproto-d{font:400 12px/1.4 var(--font);color:var(--ink-4)}

/* ---------------- 表 ---------------- */
.xtab{width:100%;border-collapse:collapse;font:400 13px/1.5 var(--font)}
.xtab td{padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle;white-space:nowrap}
.xtab tr:last-child td{border-bottom:0}
.xtab tr:hover td{background:var(--surface)}
.xtab .c-asset{width:1%}
.xtab .c-from,.xtab .c-to{width:1%;text-align:right;color:var(--ink-3)}
.xtab .c-time{width:1%}
.xtab .c-tx,.xtab .c-recv{width:1%}
.xtab .dim{color:var(--ink-4)}
.xmore{padding:12px 0 0;border-top:1px solid var(--line-soft);margin-top:4px}
@media(max-width:760px){
  .xtab .c-from,.xtab .c-to{display:none}
}

/* ---------------- 列表 ---------------- */
.xlist{display:grid;gap:1px;background:var(--line-soft);max-height:420px;overflow:auto}
.xlist-r{background:var(--bg-1);padding:9px 12px;display:flex;align-items:center;gap:10px;
  font:400 12px/1.5 var(--mono)}
.xgrow{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
/* 源可达性：实心 = 通，空心 = 不通。不用红绿 */
.xdot{flex:0 0 auto;width:8px;height:8px;border:1px solid var(--ink-4);border-radius:50%}
.xdot.on{background:var(--ink-2);border-color:var(--ink-2)}

/* ---------------- 输入输出 ----------------
   方向不靠颜色：实心 = 价值落在这里（输出），空心 = 价值从这里离开（输入）。 */
.xio{display:grid;gap:1px;background:var(--line-soft)}
.xio-row{background:var(--bg-1);padding:9px 12px;display:flex;align-items:center;gap:9px;
  font:400 12.5px/1.5 var(--mono);flex-wrap:wrap}
.xio-dir{flex:0 0 auto;width:9px;height:9px;border:1px solid var(--ink-3);border-radius:50%;color:var(--ink-4)}
.xio-dir.on{background:var(--ink-2);border-color:var(--ink-2)}
.xio-i{color:var(--ink-5);min-width:34px}

.xext{margin:18px 0 0}
.xext .btn{text-decoration:none}

/* ---------------- 遮蔽符 ----------------
   盲地址画成 crc1 + 16 个符号。真实地址 95 位，照实画会把卡片撑爆；
   符号纯装饰，页面上定时变换。**一个真字符都不能露** ——
   哪怕露 5 位尾巴，在几百行的列表里那就成了主键，
   两行尾巴相同就把两组地址并成同一个人。 */
.xcry{color:var(--ink-3);font-family:var(--mono);letter-spacing:.06em;
  border-bottom:1px dotted var(--line-strong);cursor:help}

.xchip{display:inline-block;padding:2px 7px;border:1px solid var(--line);
  font:600 10.5px/1.5 var(--mono);letter-spacing:.08em;color:var(--ink-2)}

/* ---------------- 首页：铸造动态 ---------------- */
#h-dep .xtab{font-size:12.5px}
#h-dep .xtab td{padding:9px 10px}

.is-explorer .foot{padding-top:34px}

/* 讨论区：可折叠的问答 */
.fr-d{border-bottom:1px solid var(--line-soft)}
.fr-d:last-child{border-bottom:0}
.fr-d>summary{
  list-style:none;cursor:pointer;padding:14px 2px;
  font:400 14.5px/1.6 var(--font);color:var(--ink-1);
  display:flex;gap:13px;align-items:baseline;
  transition:color .15s;
}
.fr-d>summary::-webkit-details-marker{display:none}
.fr-d>summary:hover{color:var(--brand)}
.fr-d>summary .mono{color:var(--ink-5);font-size:12px;flex:0 0 auto}
.fr-d[open]>summary{color:var(--ink-display)}
.fr-d[open]>summary .mono{color:var(--brand)}
.fr-d>p{
  margin:0 0 16px;padding:0 2px 0 33px;
  font:400 14px/1.72 var(--font);color:var(--ink-2);max-width:66ch;
}
#fr-draft{font-family:var(--font)}
textarea:focus{box-shadow:inset 2px 0 0 var(--brand)}

/* 页面主标题（Explorer / 讨论）
   每页必须有唯一 h1 —— 屏幕阅读器靠它定位，这是无障碍底线，
   不是排版偏好。之前这两个页面都没有 h1。 */
.xs-h1{
  margin:0 0 8px;
  font:400 clamp(24px,3vw,34px)/1.1 var(--mono);
  letter-spacing:.14em;color:var(--ink-display);
  text-shadow:0 0 42px rgba(157,255,200,.10);
}
.xs-sub{
  margin:0 0 26px;max-width:62ch;
  font:400 14px/1.7 var(--font);color:var(--ink-4);
}

/* 行情页：价格卡 */
.mk-px-v{
  font:400 26px/1.1 var(--mono);color:var(--ink-display);
  margin:2px 0 8px;letter-spacing:-.01em;
}
.mk-px-d{
  margin:0;font:400 12.5px/1.7 var(--font);color:var(--ink-5);
}
/* 触及计价上限时必须显眼 —— 它改变的是用户实际付出的钱 */
.mk-warn{
  color:var(--ink-1);border-left:2px solid var(--brand);
  padding-left:8px;display:inline-block;margin-bottom:6px;
}
.proto-note{
  margin:16px 0 0;font:400 13px/1.72 var(--font);color:var(--ink-4);max-width:70ch;
}
