/* style.css — 全终端 TUI 博客 · 统一行网格系统
   ═══ 行系统铁律(全站严格对齐,任意时刻)═══
   1. --lh:23px = 全局唯一行高。body line-height 恒 23,一切文本行盒高 = 23px。
   2. #term 总高 = var(--term-h),由 JS 对齐到 23 整数倍(≈视口高取整)。
   3. #dock 固定高 = 69px = 3×23(输入行 23 + 状态区 46),分隔线绝对定位不占高。
   4. #screen 高 = term − dock = 23 的整数倍 → clientHeight 整除 23,视口内恒整数行。
   5. 所有块(文本行/光标行/字符框/art)高度都是 23 的整数倍,垂直 margin/padding 全零。
   ⇒ 任意时刻视口首行、末行都完整落在行边界;滚动位置天然是 23 倍数。
   机器可读:内容全静态 HTML,无 JS 可读。 */
:root{
  --lh:23px;             /* 全局行高(与 nav.js ROW=23 一致) */
  --dock-h:69px;         /* dock = 3 行 */
  --term-h:100vh;        /* JS 在 load/resize 对齐到 23 倍数 */
  --bg:#0d1117; --bg2:#0a0e14; --line:#1e2a3a; --line2:#2a3a52;
  --fg:#c8d3e0; --dim:#5f6e85; --wht:#e8eef7;
  --grn:#7ec699; --cyn:#6fc3d9; --blu:#82aaff; --yel:#d9b96a;
  --red:#d98a8a; --mgn:#c39bd6;
  --sel-bg:#dfe8f4; --sel-fg:#0d1117;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%; background:var(--bg)}
body{
  background:var(--bg); color:var(--fg);
  font-family:"Cascadia Mono",Consolas,"Courier New","Microsoft YaHei","微软雅黑","Noto Sans Mono CJK SC",monospace;
  font-size:14.5px;
  line-height:var(--lh);        /* ★ 行盒恒 23px */
  overflow:hidden;
}
#term{
  height:var(--term-h);          /* JS 对齐到 23 倍数 */
  display:flex; flex-direction:column;
}

/* ============ 输出区 ============
   高 = term − dock(恒为 23 倍数);无垂直 padding,行网格从 0 起。 */
#screen{
  flex:1 1 auto;
  height:calc(var(--term-h) - var(--dock-h));   /* = 23×n */
  overflow-y:auto; overflow-x:hidden;
  padding:0 18px;
  outline:none;
  scrollbar-width:thin; scrollbar-color:var(--line2) transparent;
  overscroll-behavior:none;
  scroll-behavior:auto;
  contain:content;
}
#screen::-webkit-scrollbar{width:9px}
#screen::-webkit-scrollbar-thumb{background:var(--line2); border-radius:4px}
#screen::-webkit-scrollbar-track{background:transparent}

/* ============ 底部 dock = 3 行(69px),严格 23 网格 ============
   dtop/dbot 绝对定位不占高(分隔线);drow=1行;dstat=2行。 */
#dock{
  flex:0 0 auto; height:var(--dock-h);
  position:relative; z-index:50; background:var(--bg2);
}
.dtop,.dbot{ position:absolute; left:0; right:0; height:1px; background:#3a2b52; pointer-events:none }
.dtop{ top:0 } .dbot{ bottom:0 }
#dock:focus-within .dtop{ background:#5a4480 }
/* 输入行 = 1 行(23px) */
.drow{
  display:flex; align-items:center; gap:10px;
  height:var(--lh); padding:0 20px;
}
.ip{color:var(--grn); white-space:pre; user-select:none; line-height:var(--lh)}
#cmd{
  flex:1; background:transparent; border:none; outline:none;
  color:var(--wht); font:inherit; min-width:0;
  line-height:var(--lh);      /* 输入行盒 23 */
  caret-color:var(--grn);
}
#cmd::placeholder{color:var(--dim); opacity:.7}
/* 状态区 = 2 行(46px):左 路径/统计 两行,右 站点/版本 垂直居中 */
.dstat{
  display:flex; align-items:stretch; justify-content:space-between;
  height:calc(var(--lh)*2); padding:0 20px;
}
.dsl{ display:flex; flex-direction:column; justify-content:center; min-width:0 }
.ds1{ color:#9aa7bd; line-height:var(--lh); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px }
.ds1 .br{color:var(--dim)}
.ds2{ color:var(--dim); line-height:var(--lh); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px }
.dsr{ display:flex; align-items:center; gap:8px; white-space:nowrap; flex:0 0 auto }
.dsr .rn{ color:#c9d4e3; line-height:var(--lh); font-size:11.5px }
.dsr .rm{ color:var(--dim); line-height:var(--lh); font-size:11.5px }

/* ============ 顶图 / 文本行(全部行盒 23px,禁止覆盖 line-height) ============ */
.artblock{padding:0; overflow-x:auto}
.artline{white-space:pre; font-size:15px}        /* line-height 继承 23 —— 保持网格 */
.artsub{font-size:.93em; color:var(--dim)}
.boot{color:var(--dim); font-size:12px; opacity:.8}
.cathead{font-size:.95em}
.cathead .w{color:var(--wht); font-weight:600}
/* .l = 基础文本行:必有内容(空格/ ),行盒 23px(继承) */
.l{white-space:pre-wrap; word-break:break-word}
.l.w{color:var(--wht); font-weight:600}
.l.g{color:var(--grn)} .l.c{color:var(--cyn)} .l.b{color:var(--blu)}
.l.y{color:var(--yel)} .l.r{color:var(--red)} .l.m{color:var(--mgn)} .l.d{color:var(--dim)}
/* 文本内链接(如首页底部"机器端点") */
a.lnk{color:var(--cyn); text-decoration:underline; cursor:pointer}
a.lnk:hover{color:var(--wht)}

/* ============ 光标行(垂直 padding 0 → 选中反色整行仍占 23px/行) ============ */
.row{
  display:block; text-decoration:none; color:var(--fg);
  padding:0 8px 0 4px; cursor:pointer; outline:none;
  white-space:pre-wrap; word-break:break-word;
}
.row .ln{color:var(--dim); display:inline-block; min-width:10.2ch}
.row .ti{font-weight:500}
.row .dt,.row .cnt,.row .cd,.row .tags,.row .desc{color:var(--dim)}
.row .desc{display:block; padding-left:2.6em; font-size:.92em}
.row .tag{display:inline-block; min-width:4ch; font-weight:600}
.t.g{color:var(--grn)} .t.c{color:var(--cyn)} .t.b{color:var(--blu)}
.t.y{color:var(--yel)} .t.m{color:var(--mgn)} .t.r{color:var(--red)}
.row:hover{background:rgba(130,170,255,.1)}
.row.sel{ background:var(--sel-bg); color:var(--sel-fg) }
.row.sel .ln,.row.sel .ti,.row.sel .desc,.row.sel .dt,.row.sel .cnt,.row.sel .cd,.row.sel .tags,.row.sel .tag,.row.sel .t{color:var(--sel-fg)}
.row.sel::before{content:"> "}
.row:not(.sel)::before{content:"  "}
.uprow,.navrow{padding-left:2.2em}

/* ============ 动态命令项(help/ls 输出) ============ */
.cmditem{
  display:block; padding:0 8px 0 4px; cursor:pointer;
  white-space:pre-wrap; word-break:break-word; outline:none;
  border-left:2px solid transparent;
}
.cmditem .cg{color:var(--blu); font-weight:600}
.cmditem .cdim{color:var(--dim)}
.cmditem:hover{background:rgba(130,170,255,.1)}
.cmditem.sel{ background:var(--sel-bg); color:var(--sel-fg); border-left:2px solid var(--blu) }
.cmditem.sel .cg,.cmditem.sel .cdim{color:var(--sel-fg)}
.cmditem.sel::before{content:"> "}
.cmditem::before{content:"  "}

/* ============ 字符框(flex:左| 内容 右|;行盒继承 23,垂直零边距) ============ */
.frame{margin:0}
.fl{display:flex; align-items:flex-start; white-space:pre-wrap; word-break:break-word}
.fb{flex:0 0 auto; color:var(--grn); user-select:none}
.fc{flex:1 1 auto; padding:0 8px; min-width:0}
.fill{flex:1 1 auto; overflow:hidden; color:var(--grn); white-space:nowrap}
.fc .w{color:var(--wht); font-weight:600}
.fc .d{color:var(--dim)}

/* ============ 分组标题 ============ */
.gtitle{color:var(--grn); font-weight:600}

/* ============ 正文行号(CSS counter;行盒 23px,行号绝对定位在行内) ============ */
article .l{position:relative; padding-left:4.4em}
article .l.plain{padding-left:0}
article .l.plain::before{content:none}
article .l::before{
  content:counter(line) "  "; counter-increment:line;
  position:absolute; left:0; top:0; width:3.6em; text-align:right;
  color:var(--dim); opacity:.6; user-select:none;
}
article{counter-reset:line}
#postnav{padding:0}

::selection{background:var(--blu); color:var(--bg)}

/* ============ Copied toast(终端风格:深底 + 等宽绿字,字符框感) ============ */
#copy-toast{
  position:fixed; bottom:96px; right:18px; z-index:9999;
  background:#0a0e14; color:#7ec699;            /* 终端深底 + 绿字 */
  font-size:12.5px;
  font-family:"Cascadia Mono",Consolas,"Courier New","Microsoft YaHei","微软雅黑",monospace;
  padding:5px 14px;
  border:1px solid #2a3a52;                      /* 细线字符框感 */
  box-shadow:0 2px 10px rgba(0,0,0,.5);
  opacity:0; transform:translateY(4px);
  transition:opacity .15s ease, transform .15s ease;
  pointer-events:none; white-space:nowrap;
}
#copy-toast.show{ opacity:1; transform:translateY(0) }
#copy-toast::before{ content:'✓ '; color:#7ec699 }
/* 行号感前缀?直接文案即可 */
@media(max-width:640px){
  body{font-size:13px}          /* line-height 仍 23:网格不变 */
  #screen{padding:0 10px}
  .drow{padding:7px 12px 2px}
  .dstat{padding:2px 12px 7px}
  .dsr{display:none}
}