/* =============================================================
   y.cx TERMINAL  v1.99
   Typecho Theme — 1999 命令行 / 磷光终端 BBS 视觉风格
   配色 / 字体 / 布局 / 交互细节统一在此定义
   ============================================================= */

:root{
  --bg:        #050805;   /* 墨黑底（带一点绿调） */
  --bg-soft:   #0a0f0a;
  --panel:     #0c140c;   /* 面板/卡片底 */
  --fg:        #38ff8e;   /* 磷光绿：主文字 */
  --fg-dim:    #1f9c54;   /* 次级绿 */
  --fg-faint:  #0f5c30;   /* 极暗绿：辅助线/注释 */
  --amber:     #ffb000;   /* 琥珀：标题/强调 */
  --cyan:      #36e6ff;   /* 青：链接 */
  --magenta:   #ff5cc8;   /* 品红：特殊标记 */
  --red:       #ff5b5b;   /* 红：告警/错误 */
  --line:      #163d24;   /* 盒线/分隔线 */
  --line-soft: #0d2616;
  --glow:      0 0 6px rgba(56,255,142,.45);
  --mono: "Cascadia Code","Sarasa Mono SC","Noto Sans Mono CJK SC",
          "WenQuanYi Micro Hei Mono","Courier New",monospace;
  --w: 860px;             /* 内容最大宽度，仿老页面 */
  --pad: 22px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ background:var(--bg); }

body{
  margin:0;
  background:
    radial-gradient(120% 120% at 50% -10%, #0a140a 0%, var(--bg) 60%) fixed;
  color:var(--fg);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.75;
  letter-spacing:.2px;
  text-shadow:var(--glow);
  -webkit-font-smoothing:none;
  image-rendering:pixelated;
  min-height:100vh;
}

/* ---------- CRT 扫描线 + 暗角 ---------- */
.crt::before{
  content:"";
  position:fixed; inset:0; z-index:9998; pointer-events:none;
  background:repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0px,
    rgba(0,0,0,0) 2px,
    rgba(0,0,0,.22) 3px,
    rgba(0,0,0,.22) 3px);
  mix-blend-mode:multiply;
}
.crt::after{
  content:"";
  position:fixed; inset:0; z-index:9997; pointer-events:none;
  background:radial-gradient(120% 120% at 50% 50%,
    rgba(0,0,0,0) 55%, rgba(0,0,0,.55) 100%);
  animation:flicker 6s infinite steps(60);
}
@keyframes flicker{ 0%,97%{opacity:1} 98%{opacity:.82} 99%{opacity:1} 100%{opacity:.9} }

/* ---------- 容器 ---------- */
.wrap{
  max-width:var(--w);
  margin:0 auto;
  padding:18px var(--pad) 40px;
}

/* ---------- 顶部仿真终端标题栏 ---------- */
.titlebar{
  display:flex; align-items:center; gap:10px;
  border:1px solid var(--line);
  border-bottom:none;
  background:linear-gradient(var(--bg-soft),#070c07);
  padding:6px 12px;
  font-size:12px; color:var(--fg-dim);
}
/* 标题栏为纯文字（已移除 macOS 风格 ● ● ● 圆点） */
.tb-title{ color:var(--fg); flex:0 0 auto; }
.tb-sep{ color:var(--fg-faint); }
.tb-status{ margin-left:auto; color:var(--amber); }
.tb-clock{ color:var(--cyan); }

/* ---------- 站点横幅 ---------- */
.banner{
  border:1px solid var(--line);
  border-top:none;
  background:var(--panel);
  padding:18px var(--pad);
}
.banner .prompt{
  margin:10px 0 0; color:var(--fg);
}
.banner .prompt .user{ color:var(--cyan); }
.banner .prompt .host{ color:var(--magenta); }
.banner .prompt .path{ color:var(--fg-dim); }
.banner .tagline{ color:var(--fg-dim); margin:4px 0 0; }
.banner .tagline .cur{ color:var(--fg); }

/* ---------- 导航 ---------- */
.nav{
  border:1px solid var(--line);
  border-top:none;
  background:var(--bg-soft);
  padding:8px var(--pad);
  font-size:13px;
  display:flex; flex-wrap:wrap; gap:4px 14px;
}
.nav a{ color:var(--fg); text-decoration:none; }
.nav a:hover{ color:var(--amber); text-shadow:0 0 8px rgba(255,176,0,.6); }
.nav .sep{ color:var(--fg-faint); }

/* ---------- 跑马灯 ---------- */
.ticker{
  border:1px solid var(--line); border-top:none;
  background:#070c07; color:var(--amber);
  font-size:12px; overflow:hidden; white-space:nowrap;
}
.ticker span{
  display:inline-block; padding:5px 0;
  animation:marquee 22s linear infinite;
}
@keyframes marquee{ from{transform:translateX(100%)} to{transform:translateX(-100%)} }

/* ---------- 布局：主区 + 侧栏 ---------- */
.shell{ display:flex; gap:20px; align-items:flex-start; }
.content{ flex:1 1 auto; min-width:0; }
.sidebar{
  flex:0 0 220px;
  border:none;
  border-left:1px solid var(--line-soft);
  background:transparent;
  padding:0 0 0 16px;
  font-size:13px;
}
.sidebar h3{
  margin:0 0 10px; font-size:13px; color:var(--amber);
  border-bottom:1px dashed var(--line); padding-bottom:6px;
  text-transform:uppercase; letter-spacing:1px;
}
.sidebar ul{ list-style:none; margin:0 0 18px; padding:0; }
.sidebar li{ padding:3px 0; border-bottom:1px dotted var(--line-soft); }
.sidebar a{ color:var(--fg); text-decoration:none; }
.sidebar a:hover{ color:var(--cyan); }
.sidebar .meta-row{ display:flex; justify-content:space-between; color:var(--fg-dim); }

/* ---------- 文章 / 列表项通用卡片 ---------- */
/* 真实终端没有"卡片"：输出就是一行行文字，靠缩进与提示行分隔，不靠边框和底色 */
.card{
  border:none;
  background:transparent;
  padding:0 0 4px;
  margin-bottom:22px;
}
.card .bar{
  display:flex; align-items:center; gap:8px;
  color:var(--fg-faint); font-size:12px; margin-bottom:8px;
}
.card .bar .idx{ color:var(--amber); }
.card h2, .card h1{
  margin:.1em 0 .35em; line-height:1.35;
  font-size:19px; color:var(--fg);
}
.card h2 a, .card h1 a{ color:var(--fg); text-decoration:none; }
.card h2 a:hover, .card h1 a:hover{ color:var(--amber); }
.card .excerpt{ color:var(--fg-dim); }
.card .more{ display:inline-block; margin-top:8px; color:var(--cyan); text-decoration:none; }
.card .more:hover{ color:var(--amber); }

/* 文章元数据：仿 ls -la 权限串 */
.meta{
  color:var(--fg-dim); font-size:12px;
  border-left:2px solid var(--line); padding-left:10px; margin:6px 0 12px;
}
.meta b{ color:var(--cyan); font-weight:400; }
.meta .tag{ color:var(--magenta); }

/* ---------- 正文排版 ---------- */
.post-body{ font-size:15px; }
.post-body p{ margin:0 0 1em; }
.post-body h2,.post-body h3,.post-body h4{
  color:var(--amber); border-bottom:1px dashed var(--line);
  padding-bottom:4px; margin:1.4em 0 .6em;
}
.post-body h2::before{ content:"## "; color:var(--fg-faint); }
.post-body h3::before{ content:"### "; color:var(--fg-faint); }
.post-body a{ color:var(--cyan); text-decoration:underline; text-underline-offset:3px; }
.post-body a:hover{ color:var(--amber); }
.post-body code{
  background:#07120a; border:1px solid var(--line);
  padding:1px 6px; color:var(--magenta); border-radius:0;
}
.post-body pre{
  background:#07120a; border:1px solid var(--line);
  padding:14px 16px; overflow:auto; color:var(--fg);
  font-size:13px; line-height:1.6;
}
.post-body pre::before{
  content:"$ cat << 'EOF'"; display:block;
  color:var(--fg-faint); margin-bottom:8px;
}
.post-body pre code{ background:none; border:none; padding:0; color:inherit; }
.post-body blockquote{
  border-left:3px solid var(--amber); margin:1em 0; padding:4px 14px;
  color:var(--fg-dim); background:rgba(255,176,0,.04);
}
.post-body img{ max-width:100%; border:1px solid var(--line); filter:saturate(.9) contrast(1.05); }
.post-body hr{ border:none; border-top:1px dashed var(--line); margin:1.6em 0; }
.post-body table{ border-collapse:collapse; width:100%; font-size:13px; }
.post-body th,.post-body td{ border:1px solid var(--line); padding:6px 10px; }
.post-body th{ background:#07120a; color:var(--amber); }

/* ---------- 归档/目录式列表 ---------- */
.ls{ font-size:13px; }
.ls .row{
  display:grid; grid-template-columns:96px 1fr auto; gap:10px;
  padding:5px 0; border-bottom:1px dotted var(--line-soft);
}
.ls .row:hover{ background:rgba(56,255,142,.05); }
.ls .perm{ color:var(--fg-faint); }
.ls .name a{ color:var(--fg); text-decoration:none; }
.ls .name a:hover{ color:var(--amber); }
.ls .size{ color:var(--fg-dim); }

/* ---------- 分页 ---------- */
.pager{ display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; font-size:13px; }
.pager a, .pager span{
  border:1px solid var(--line); padding:5px 12px; color:var(--fg);
  text-decoration:none; background:var(--panel);
}
.pager a:hover{ color:var(--amber); border-color:var(--amber); }
.pager .current{ color:var(--bg); background:var(--fg); border-color:var(--fg); }

/* ---------- 评论区（终端会话框）---------- */
.comments{ margin-top:26px; }
.comments > h3{
  color:var(--amber); font-size:14px; margin:0 0 12px;
  border-bottom:1px dashed var(--line); padding-bottom:6px;
}
.comment{
  border:1px solid var(--line); background:var(--bg-soft);
  padding:10px 14px; margin-bottom:12px;
}
.comment .c-meta{ color:var(--fg-dim); font-size:12px; margin-bottom:6px; }
.comment .c-meta .who{ color:var(--cyan); }
.comment .c-meta .at{ color:var(--magenta); }
.comment .c-body{ color:var(--fg); }
.comment .c-body p{ margin:0 0 .6em; }
.comment .reply{
  font-size:12px; color:var(--amber); text-decoration:none;
}
.comment .reply:hover{ color:var(--cyan); }

/* 评论表单 = 终端输入区 */
.c-form{
  border:1px solid var(--line); background:var(--panel);
  padding:14px 16px; margin-top:14px;
}
.c-form .line{ color:var(--fg-dim); font-size:12px; margin-bottom:8px; }
.c-form label{ display:block; color:var(--cyan); font-size:12px; margin:10px 0 4px; }
.c-form input, .c-form textarea{
  width:100%; background:#07120a; border:1px solid var(--line);
  color:var(--fg); font-family:var(--mono); font-size:14px;
  padding:8px 10px; outline:none;
}
.c-form input:focus, .c-form textarea:focus{
  border-color:var(--amber); box-shadow:var(--glow);
}
.c-form textarea{ min-height:110px; resize:vertical; }
.c-form .submit{
  margin-top:12px; background:var(--fg); color:var(--bg);
  border:1px solid var(--fg); padding:8px 18px; font-family:var(--mono);
  font-size:13px; cursor:pointer; letter-spacing:1px;
}
.c-form .submit:hover{ background:var(--amber); border-color:var(--amber); }

/* ---------- 页脚 ---------- */
.foot{
  border:1px solid var(--line); border-top:none;
  background:#070c07; color:var(--fg-dim);
  padding:14px var(--pad); font-size:12px; line-height:1.9;
}
.foot a{ color:var(--cyan); text-decoration:none; }
.foot a:hover{ color:var(--amber); }
.foot .badges{ display:flex; flex-wrap:wrap; gap:8px 16px; margin:8px 0; }
.foot .badge{ border:1px solid var(--line); padding:2px 8px; color:var(--fg-dim); }
.foot .badge b{ color:var(--amber); font-weight:400; }
.foot .copy .cur{ color:var(--fg); animation:blink 1s steps(2) infinite; }
@keyframes blink{ 50%{opacity:0} }

/* ---------- 通用：闪烁光标 ---------- */
.cur{ display:inline-block; color:var(--fg); animation:blink 1s steps(2) infinite; }
@keyframes blink{ 50%{opacity:0} }

/* ---------- 404 ---------- */
.err{ text-align:center; padding:60px 0; }
.err .code{ font-size:64px; color:var(--red); text-shadow:0 0 12px rgba(255,91,91,.6); }
.err .msg{ color:var(--fg-dim); }

/* ---------- 响应式 ---------- */
@media (max-width:768px){
  body{ font-size:14px; }
  .wrap{ padding:12px 12px 30px; }
  .shell{ flex-direction:column; }
  .sidebar{ flex:1 1 auto; width:100%; }
  .brand-logo{ max-width:220px; }
  .ls .row{ grid-template-columns:74px 1fr; }
  .ls .size{ display:none; }
  .titlebar{ font-size:11px; }
  .tb-title{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
@media (max-width:480px){
  .brand-logo{ max-width:170px; }
  .nav{ font-size:12px; gap:4px 10px; }
}

/* 尊重用户的减少动效偏好 */
@media (prefers-reduced-motion:reduce){
  .crt::after, .ticker span, .cur, .foot .copy .cur{ animation:none; }
}

/* ---------- 站点 Logo（真实品牌素材） ---------- */
.brand-logo{
  display:block;
  max-width:280px; width:auto; height:auto;
  margin:8px auto 2px;
  filter: drop-shadow(0 0 8px rgba(56,255,142,.55));
}
.brand-logo:hover{ filter: drop-shadow(0 0 14px rgba(56,255,142,.85)); }

/* ---------- 另两套配色（终端执行 theme 命令切换，选择会被记住） ---------- */
/* P3 琥珀：70–80 年代办公终端（IBM 3270 / DEC VT220 琥珀版） */
html[data-theme="amber"]{
  --bg:#080603; --bg-soft:#0f0a04; --panel:#120d04;
  --fg:#ffb000; --fg-dim:#b07d10; --fg-faint:#5c4108;
  --amber:#ffd766; --cyan:#ffd766; --magenta:#ff9ad0; --red:#ff5b5b;
  --line:#3d2c0d; --line-soft:#2a1e09;
  --glow:0 0 6px rgba(255,176,0,.4);
}
/* VGA 文本模式：1999 年真实的开机画面——纯黑底 + 浅灰字（VGA color 7）。
   文本模式没有荧光余晖，所以这套不给辉光。 */
html[data-theme="vga"]{
  --bg:#000000; --bg-soft:#0a0a0a; --panel:#0d0d0d;
  --fg:#c8c8c8; --fg-dim:#8a8a8a; --fg-faint:#555555;
  --amber:#ffd766; --cyan:#79c7dc; --magenta:#d0a0d8; --red:#e86a6a;
  --line:#2a2a2a; --line-soft:#1a1a1a;
  --glow:none;
}

/* 辉光开关：终端执行 glow off 时给 <html> 加 data-glow="off"。
   全站辉光都走 var(--glow)，所以把变量置为 none 即可一次性关掉所有发光。 */
html[data-glow="off"]{ --glow:none; }

/* ---------- 底部可交互终端 ---------- */
.term{
  border:1px solid var(--line);
  margin:0 0 14px;
  background:#070b07;
  text-align:left;
}
.term-bar{
  border-bottom:1px solid var(--line);
  padding:5px 10px;
  color:var(--fg-dim);
  font-size:12px;
}
.term-bar b{ color:var(--amber); font-weight:400; }
.term-out{
  max-height:230px;
  overflow-y:auto;
  padding:8px 10px;
  line-height:1.7;
  font-size:13px;
}
.term-line{ white-space:pre-wrap; word-break:break-word; color:var(--fg); }
.term-line.dim{ color:var(--fg-dim); }
.term-line.err{ color:var(--red); }
.term-line.echo{ color:var(--amber); }
.term-line a{ color:var(--cyan); text-decoration:none; }
.term-line a:hover{ color:var(--amber); text-decoration:underline; }
.term-logo{ color:var(--fg); white-space:pre; text-shadow:0 0 6px rgba(56,255,142,.45); }
.term-in{
  display:flex; align-items:center; gap:8px;
  border-top:1px solid var(--line);
  padding:7px 10px;
}
.term-prompt{ color:var(--fg); white-space:nowrap; font-size:13px; }
.term-input{
  flex:1; min-width:0;
  background:transparent; border:none; outline:none;
  color:var(--fg); font:inherit; font-size:13px;
  caret-color:var(--fg);
}
.term-input::placeholder{ color:var(--fg-faint); }
.term-input:disabled{ color:var(--fg-dim); }
.term-cur{ color:var(--fg); animation:blink 1s steps(2) infinite; }
.term-out::-webkit-scrollbar{ width:8px; }
.term-out::-webkit-scrollbar-thumb{ background:var(--line); }
.term-out::-webkit-scrollbar-track{ background:transparent; }

/* ---------- 每页顶部的命令回显 ---------- */
.cmdline{
  margin:0 0 14px;
  padding:6px 10px;
  border-left:2px solid var(--fg-dim);
  background:var(--bg-soft);
  color:var(--fg);
  font-size:13px;
  word-break:break-all;
}
.cmdline .p{ color:var(--fg-dim); }

/* ---------- 纯命令行模式（默认进入；home 显示站点，exit 退回命令行） ---------- */
html.clionly, html.clionly body{ overflow:hidden; }
html.clionly .wrap{
  height:100vh; max-width:none;
  display:flex; flex-direction:column;
}
html.clionly .banner,
html.clionly .nav,
html.clionly .ticker,
html.clionly .shell,
html.clionly .foot{ display:none; }
html.clionly .term{
  flex:1; min-height:0; margin:0;
  display:flex; flex-direction:column;
  border:none; border-top:1px solid var(--line);
  background:var(--bg);
}
html.clionly .term-out{ flex:1; max-height:none; overflow-y:auto; }
html.clionly .term-in{ flex:0 0 auto; }