/* ============================================================
   www.smallandlife.com · 站点基础样式
   ============================================================ */

:root {
    --bg:        #0f1115;
    --panel:     #171a21;
    --line:      #262b36;
    --text:      #e6e9ef;
    --dim:       #8b93a7;
    --accent:    #4ade80;
    --bad:       #f87171;
    --link:      #7dd3fc;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    padding: 3rem 1.25rem;
    background: var(--bg);
    color: var(--text);
    font: 15px/1.65 "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
}

.wrap { max-width: 780px; margin: 0 auto; }

.hero { margin-bottom: 2rem; }

.eyebrow {
    margin: 0 0 .4rem;
    font-size: .8rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--dim);
}

h1 { margin: 0 0 .6rem; font-size: 2.1rem; font-weight: 650; }
h2 { margin: 0 0 1rem; font-size: 1.05rem; font-weight: 600; }

.lead { margin: 0; color: var(--dim); }

.card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 1.4rem 1.5rem;
    margin-bottom: 1.25rem;
}

.kv { width: 100%; border-collapse: collapse; }

.kv th {
    width: 34%;
    padding: .5rem .75rem .5rem 0;
    text-align: left;
    font-weight: 500;
    color: var(--dim);
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}

.kv td {
    padding: .5rem 0;
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}

.kv tr:last-child th,
.kv tr:last-child td { border-bottom: 0; }

.ok  { color: var(--accent); font-weight: 600; }
.bad { color: var(--bad);    font-weight: 600; }
.dim { color: var(--dim); margin-left: .5rem; }
.kv td .ok + .ok,
.kv td .bad + .bad { margin-left: .75rem; }

.hint { margin: 1rem 0 0; color: var(--dim); font-size: .86rem; }

code {
    background: #0b0d12;
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: .1rem .4rem;
    font-size: .87em;
    font-family: Consolas, "Cascadia Mono", monospace;
    color: var(--text);
}

a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }

.foot {
    margin-top: 2rem;
    color: var(--dim);
    font-size: .85rem;
    text-align: center;
}
