/* ============================================================
   03 · 两种语言 — 编辑器 / 终端
   ============================================================ */

.scene--code{
  background:#0A0B0E;
  color:#DDE2EA;
  --sh-line:rgba(230,236,245,.16);
  --sh-num:#8FA7FF;
  --sh-dim:#7E8798;
  --sh-title:#F4F6FA;
  --prose-lead:#F4F6FA;
  --prose-em:#9DB8FF;
  --prose-hl:rgba(127,156,245,.18);
}
.ed-bg{position:absolute;inset:0;overflow:hidden;z-index:0}
.ed-grid{
  position:absolute;inset:-10%;
  background-image:
    linear-gradient(rgba(160,180,220,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(160,180,220,.045) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 75% 60% at 62% 45%,#000,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 75% 60% at 62% 45%,#000,transparent 78%);
}
.ed-glow{
  position:absolute;width:60vw;height:60vw;right:-14vw;top:-10vw;
  background:radial-gradient(circle,rgba(72,110,200,.20),rgba(40,60,120,.08) 45%,transparent 68%);
  filter:blur(50px);
}

.ed-layout{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(34px,4.8vw,68px);
  margin-top:clamp(44px,6.5vh,74px);
  align-items:start;
}
.ed-prose{max-width:30em;padding-top:6px}
.ed-stats{
  display:flex;gap:0;margin-top:42px;
  border-top:1px solid rgba(230,236,245,.14);
  padding-top:18px;
}
.ed-stats div{
  flex:1;padding-right:18px;
  border-right:1px solid rgba(230,236,245,.10);
}
.ed-stats div:last-child{border-right:0;padding-left:18px;padding-right:0}
.ed-stats b{
  display:block;font-family:var(--f-display);font-weight:400;
  font-size:36px;line-height:1;color:#F4F6FA;
}
.ed-stats span{
  display:block;margin-top:7px;
  font-family:var(--f-mono);font-size:8px;letter-spacing:.14em;
  text-transform:uppercase;color:#77808F;
}

/* ---------- 编辑器窗口 ---------- */
.ed-window{
  position:relative;top:0;
  background:#0F1115;
  border:1px solid #232833;
  border-radius:10px;
  overflow:hidden;
  box-shadow:
    0 50px 100px -40px rgba(0,0,0,.9),
    0 0 0 1px rgba(255,255,255,.03),
    0 0 80px -30px rgba(80,120,220,.45);
  font-family:var(--f-mono);
}
.ed-titlebar{
  height:32px;display:flex;align-items:center;gap:12px;
  padding:0 10px;
  background:#181B21;
  border-bottom:1px solid #101216;
  color:#8B93A3;
  font-size:9px;letter-spacing:.03em;
}
.ed-dots{display:flex;gap:5px;flex:none}
.ed-dots i{
  width:10px;height:9px;position:relative;display:block;
  border-radius:1px;
  border:1px solid #3A4150;
  background:#22262E;
}
.ed-dots i::before{
  content:"";position:absolute;left:2px;right:2px;top:3.5px;height:1px;background:#7A8494;
}
.ed-dots i:nth-child(2)::before{
  top:1.5px;bottom:1.5px;height:auto;left:2px;right:2px;
  background:none;border:1px solid #7A8494;
}
.ed-dots i:nth-child(3)::before,.ed-dots i:nth-child(3)::after{
  content:"";position:absolute;left:2px;right:2px;top:4px;height:1px;
  background:#7A8494;transform:rotate(45deg);
}
.ed-dots i:nth-child(3)::after{transform:rotate(-45deg)}
.ed-crumb{flex:1;text-align:center;font-size:8.5px;color:#78808F}
.ed-crumb em{color:#4D5566;padding-inline:3px}
.ed-winbtns{display:none}

.ed-body{display:grid;grid-template-columns:40px 132px minmax(0,1fr);height:512px}
.ed-activity{
  border-right:1px solid #1B1E25;
  display:flex;flex-direction:column;align-items:center;gap:18px;
  padding-top:14px;
  color:#59606E;
}
.ed-activity svg{width:16px;height:16px;stroke-width:1.4}
.ed-activity svg.on{color:#DDE2EA}
.ed-activity svg:nth-child(3){margin-top:6px}

.ed-explorer{
  border-right:1px solid #1B1E25;
  background:#111318;
  padding:10px 0;
  overflow:hidden;
}
.ed-explorer > p{
  font-size:7.5px;letter-spacing:.16em;color:#6B7284;
  padding:0 12px;margin-bottom:10px;
}
.ed-tree{display:flex;flex-direction:column;font-size:9px;color:#9AA2B1}
.ed-dir,.ed-file{padding:3.5px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ed-dir{color:#C3C9D4;font-size:8.5px;letter-spacing:.02em}
.ed-file{padding-left:24px;position:relative}
.ed-file::before{
  content:"";position:absolute;left:14px;top:50%;margin-top:-3px;
  width:5px;height:7px;border:1px solid #6B7A92;border-radius:.5px;
}
.ed-file.on{background:#1B2230;color:#E6ECF7;box-shadow:inset 2px 0 #4C8DF6}

.ed-editor{display:flex;flex-direction:column;min-width:0;background:#0F1115}
.ed-tabs{
  height:34px;display:flex;align-items:stretch;gap:0;
  background:#121419;border-bottom:1px solid #1B1E25;
  overflow:hidden;
}
.ed-tabs button{
  display:flex;align-items:center;gap:7px;
  padding:0 13px;
  font-family:var(--f-mono);font-size:9px;color:#8B93A3;
  border-right:1px solid #1B1E25;
  border-top:1px solid transparent;
  white-space:nowrap;
}
.ed-tabs button i{
  font-size:7px;letter-spacing:0;color:#7A8496;
  border:1px solid #3C4352;border-radius:2px;padding:0 2px;
}
.ed-tabs button.on{background:#0F1115;color:#EDF1F7;border-top-color:#4C8DF6}
.ed-tabs-spacer{flex:1}
.ed-tabs .ed-run{
  border-right:0;border-left:1px solid #1B1E25;border-top:0;
  color:#A9E5C3;font-size:8px;letter-spacing:.06em;gap:5px;
  background:rgba(46,125,79,.12);
}
.ed-tabs .ed-run:hover{background:rgba(46,125,79,.24)}
.ed-tabs .ed-run svg{width:9px;height:9px}

.ed-panes{position:relative;flex:1;min-height:0}
.ed-pane{display:none;height:100%;overflow:auto}
.ed-pane.on{display:block}
.ed-code{
  padding:14px 0 10px;
  font-size:12.5px;line-height:1.9;
  color:#C8D0DC;
  counter-reset:ln;
  tab-size:4;
}
.ed-code .cl{
  display:block;position:relative;
  padding-left:44px;
  white-space:pre;
  min-height:1.85em;
  counter-increment:ln;
}
.ed-code .cl::before{
  content:counter(ln);
  position:absolute;left:0;width:32px;
  text-align:right;
  color:#4B5464;font-size:10px;
  user-select:none;
}
.ed-code .cl:hover{background:rgba(255,255,255,.025)}
.ed-code .c{color:#5F6B7C}
.ed-code .k{color:#C792EA}
.ed-code .s{color:#A6E07A}
.ed-code .f{color:#82AAFF}
.ed-code .n{color:#F78C6C}

.ed-panel{
  height:132px;border-top:1px solid #1B1E25;
  background:#0C0E12;display:flex;flex-direction:column;
}
.ed-panel-head{
  height:27px;display:flex;align-items:center;gap:14px;
  padding:0 12px;font-size:8px;letter-spacing:.1em;color:#6F7786;
  border-bottom:1px solid #16191F;
}
.ed-panel-head .on{color:#DFE6F1}
.ed-panel-head i{color:#9BE3B8;font-style:normal}
.ed-panel-head em{margin-left:auto;font-style:normal;color:#4F5868}
.ed-term{
  flex:1;padding:8px 12px;
  font-size:10.5px;line-height:1.9;color:#A9B4C4;
  overflow:auto;
}
.ed-term .cmd{color:#DFE6F1}
.ed-term .cmd::before{content:"$ ";color:#6FCF97}
.ed-term .ok{color:#8BE3B0}
.ed-term .dim{color:#5C6678}
.ed-term .warn{color:#E8C07A}
.ed-term .caret-line{display:inline-block;width:5px;height:10px;background:#9DB8FF;vertical-align:-1px;animation:termBlink 1.05s steps(1) infinite}
@keyframes termBlink{50%{opacity:0}}

.ed-statusbar{
  height:22px;display:flex;align-items:center;gap:16px;
  padding:0 12px;
  background:#1B4C7E;color:#DCEBFA;
  font-size:8px;letter-spacing:.03em;
  white-space:nowrap;overflow:hidden;
}
.ed-statusbar span{opacity:.92}
.ed-statusbar .ed-branch{color:#fff;font-weight:500}
.ed-pos{margin-left:auto}
.ed-caption{
  display:block;padding:9px 14px;
  border-top:1px solid #1B1E25;
  background:#0C0E12;
  font-family:var(--f-serif);font-size:11px;color:#6F7786;
  letter-spacing:.02em;
}

@media (max-width:1100px){
  .ed-layout{grid-template-columns:1fr;gap:44px}
  .ed-window{position:relative;top:0}
  .ed-prose{max-width:38em}
  .ed-body{height:480px}
}
@media (max-width:760px){
  .ed-body{grid-template-columns:minmax(0,1fr);height:440px}
  .ed-activity,.ed-explorer{display:none}
  .ed-code{font-size:10.5px}
  .ed-code .cl{padding-left:38px}
  .ed-code .cl::before{width:26px;font-size:9px}
  .ed-panel{height:116px}
  .ed-statusbar{gap:10px;font-size:7.5px}
  .ed-statusbar span:nth-child(2),.ed-statusbar span:nth-child(4){display:none}
  .ed-tabs button{padding:0 10px}
  .ed-caption{font-size:10px}
}
