/* ======================================================================
 * #01 我的世界坐标换算 · 独立视觉：双世界坐标终端
 * 草绿 + 下界熔橙双色轴；等宽坐标数字；8:1 比例条；深浅主题各自成体系
 * ====================================================================== */
.mc-page {
    --g-accent: #2C8A5B;
    --g-accent-deep: #1C6B44;
    --g-accent-ink: #14543A;
    --g-accent-soft: #E2F1E7;
    --g-accent-2: #D0673B;
    --g-accent-2-soft: #FBEBE1;
    --mc-grass: #2C8A5B;
    --mc-nether: #C9552F;
    --mc-term: #101C17;
    --mc-term-line: #284234;
    --mc-term-ink: #8FE6AC;
    background-image: linear-gradient(rgba(44, 138, 91, .045) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(44, 138, 91, .045) 1px, transparent 1px);
    background-size: 28px 28px;
}
:root[data-theme="dark"] .mc-page {
    --g-accent: #6CD79A;
    --g-accent-deep: #8DE7B4;
    --g-accent-ink: #A9EFC7;
    --g-accent-soft: rgba(108, 215, 154, .13);
    --g-accent-2: #F09B6B;
    --g-accent-2-soft: rgba(240, 155, 107, .13);
    --mc-grass: #6CD79A;
    --mc-nether: #F09B6B;
    --mc-term: #08120E;
    --mc-term-line: #1E382A;
    --mc-term-ink: #A5F2C1;
    background-image: linear-gradient(rgba(108, 215, 154, .045) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(108, 215, 154, .045) 1px, transparent 1px);
}

/* 首屏：绿色草皮竖条 + 下界熔岩竖条 */
.mc-hero { position: relative; }
.mc-hero::before {
    content: ''; position: absolute; left: -24px; top: 34px; bottom: 30px; width: 5px;
    border-radius: 4px; background: linear-gradient(180deg, var(--mc-grass) 0 52%, var(--mc-nether) 52% 100%);
}
.mc-page .hero-kicker {
    background: linear-gradient(90deg, var(--g-accent-soft), var(--g-accent-2-soft));
    border-color: var(--g-line-2); font-family: var(--g-mono); letter-spacing: .06em;
}

/* 终端式读数：两种主题下都保持深色，形成「坐标屏幕」的识别点 */
.mc-readout {
    background: var(--mc-term); border-color: var(--mc-term-line);
    box-shadow: 0 16px 38px rgba(8, 24, 16, .22);
}
.mc-readout::before { background: linear-gradient(90deg, var(--mc-grass), #A7C46B, var(--mc-nether)); }
.mc-readout .lab { color: #7FA98F; font-family: var(--g-mono); }
.mc-readout .big { color: var(--mc-term-ink); font-size: clamp(19px, 2.1vw, 25px); letter-spacing: -.02em; }
.mc-readout .hint { color: #87A695; }
.mc-readout-rule { display: flex; align-items: center; gap: 9px; margin-top: 16px; padding-top: 13px; border-top: 1px dashed var(--mc-term-line); font-size: 11.5px; color: #87A695; }
.mc-readout-rule b { font-family: var(--g-mono); font-size: 15px; color: var(--mc-term-ink); }
.mc-readout-rule i { flex: 1; height: 1px; background: repeating-linear-gradient(90deg, var(--mc-term-line) 0 5px, transparent 5px 9px); }

/* 方向切换 */
.mc-dir { margin-bottom: 16px; }
.mc-dir .seg button { font-family: var(--g-mono); font-size: 12.5px; }
.mc-fields .field > span { font-family: var(--g-mono); letter-spacing: .03em; }
.mc-ver {
    display: flex; align-items: center; flex-wrap: wrap; gap: 14px;
    margin-top: 16px; padding: 11px 14px; border-radius: var(--g-r-sm);
    background: var(--g-surface-2); border: 1px dashed var(--g-line-2);
}
.mc-ver-lab { font-size: 12.5px; font-weight: 750; color: var(--g-ink-3); }
.mc-ver-tip { margin-left: auto; font-size: 12px; color: var(--g-ink-3); }

/* 结果：坐标板 */
.mc-result { border-top: 3px solid var(--mc-grass); }
.mc-coord-board { display: grid; gap: 8px; margin-bottom: 16px; }
.mc-coord-row {
    display: flex; align-items: center; gap: 14px; padding: 9px 14px;
    background: var(--mc-term); border: 1px solid var(--mc-term-line); border-radius: var(--g-r-sm);
}
.mc-coord-row span {
    display: grid; place-items: center; width: 28px; height: 28px; flex: none;
    border-radius: 7px; background: rgba(143, 230, 172, .13); color: var(--mc-term-ink);
    font: 800 14px var(--g-mono);
}
.mc-coord-row b { font: 700 clamp(19px, 2.5vw, 27px)/1.3 var(--g-mono); color: var(--mc-term-ink); letter-spacing: -.02em; word-break: break-all; }
.mc-cmd { margin-top: 16px; padding: 12px 14px; border-radius: var(--g-r-sm); background: var(--g-surface-2); border: 1px solid var(--g-line); }
.mc-cmd-lab { display: block; font-size: 11.5px; font-weight: 700; color: var(--g-ink-3); margin-bottom: 7px; }
.mc-cmd code { display: block; font: 12.5px/1.7 var(--g-mono); color: var(--g-accent-ink); word-break: break-all; margin-bottom: 9px; }

/* 双门连接检查 */
.mc-lead { font-size: 13.5px; color: var(--g-ink-2); margin-bottom: 14px; }
.mc-pair-out { margin-top: 14px; display: grid; gap: 9px; }
.mc-pair-line { display: flex; gap: 12px; align-items: baseline; font-size: 13.5px; padding: 9px 12px; border-radius: var(--g-r-sm); background: var(--g-surface-2); }
.mc-pair-line span { color: var(--g-ink-3); flex: none; }
.mc-pair-line b { font-family: var(--g-mono); color: var(--g-ink); }
.mc-pair-verdict { padding: 12px 15px; border-radius: var(--g-r-sm); font-size: 13.5px; font-weight: 650; line-height: 1.85; }
.mc-pair-verdict.ok { background: var(--g-ok-soft); color: var(--g-ok); }
.mc-pair-verdict.bad { background: var(--g-danger-soft); color: var(--g-danger); }

/* 8:1 比例图示 */
.mc-scale-card { background: var(--g-surface); border: 1px solid var(--g-line); border-radius: var(--g-r-lg); padding: 18px 22px; box-shadow: var(--g-shadow); }
.mc-svg-lab { font: 700 12px var(--g-mono); fill: var(--g-ink-2); letter-spacing: .08em; }
.mc-svg-grid rect { fill: url(#mcOver); stroke: var(--g-surface); stroke-width: 2; }
.mc-svg-num text, .mc-svg-num { fill: #fff; font: 700 15px var(--g-mono); text-anchor: middle; }
.mc-svg-arrow { stroke: var(--g-accent-2); stroke-width: 2; stroke-dasharray: 4 4; marker-end: none; }
.mc-svg-nether { fill: var(--mc-nether); }
.mc-svg-num-dark { fill: #fff; font: 700 13px var(--g-mono); text-anchor: middle; }
:root[data-theme="dark"] .mc-svg-grid rect { stroke: var(--g-surface); }
:root[data-theme="dark"] .mc-svg-lab { fill: var(--g-ink-2); }

/* 常见错误编号卡 */
.mc-pit .tile { border-top: 3px solid var(--g-line-2); transition: border-color .18s, transform .18s; }
.mc-pit .tile:hover { border-top-color: var(--mc-nether); transform: translateY(-2px); }
.mc-pit .tile .num { display: block; margin-bottom: 8px; }

/* 批量结果 */
.mc-batch-out { margin-top: 14px; overflow-x: auto; }
.mc-batch-out table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mc-batch-out th, .mc-batch-out td { padding: 8px 11px; border-bottom: 1px solid var(--g-line); text-align: left; white-space: nowrap; }
.mc-batch-out th { background: var(--g-surface-3); font-size: 12px; color: var(--g-ink-2); }
.mc-batch-out td.mono { font-family: var(--g-mono); color: var(--g-accent-ink); }
.mc-batch-out tr.bad td { color: var(--g-danger); }

@media (max-width: 620px) {
    .mc-ver-tip { margin-left: 0; width: 100%; }
    .mc-hero::before { left: -16px; }
}
