/* ========================================================================== 
   Covenant — a high-resolution Life-like laboratory
   ========================================================================== */

.cov-head { position:relative; }
.cov-head::after {
    content:"";
    position:absolute;
    right:1%; top:14%;
    width:180px; height:180px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(154,112,255,.12), transparent 68%);
    pointer-events:none;
}
.cov-head h1 small {
    display:inline-block;
    margin-left:.55rem;
    color:var(--ink-4);
    font-family:var(--font-mono);
    font-size:.22em;
    font-weight:500;
    letter-spacing:.08em;
    text-transform:uppercase;
    vertical-align:middle;
}
.badge--violet {
    border-color:color-mix(in srgb, #aa85ff 42%, var(--line));
    color:#bc9dff;
    background:color-mix(in srgb, #9b6cff 8%, transparent);
}
[data-theme="light"] .badge--violet { color:#6941b9; }

.cov-shell { grid-template-columns:minmax(0, 1fr) 334px; gap:1.25rem; }
.cov-stage {
    border-color:color-mix(in srgb, #9470d8 34%, var(--line));
    box-shadow:0 20px 70px rgba(3,4,14,.2), inset 0 0 0 1px rgba(255,255,255,.015);
}
.cov-field { position:relative; overflow:hidden; background:#03050b; aspect-ratio:16/9; }
.cov-field::after {
    content:"";
    position:absolute; inset:0;
    box-shadow:inset 0 0 90px rgba(3,5,16,.72);
    pointer-events:none;
}
#cov-canvas {
    width:100%; height:100%;
    image-rendering:pixelated;
    cursor:crosshair;
    background:#03050b;
}
#cov-canvas:focus-visible { outline:2px solid #d7bd69; outline-offset:-3px; }
.cov-veil {
    position:absolute; inset:0;
    background:
        radial-gradient(circle at 50% 42%, transparent 44%, rgba(1,2,8,.13) 100%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.014) 0, rgba(255,255,255,.014) 1px, transparent 1px, transparent 3px);
    opacity:.58;
    mix-blend-mode:screen;
    pointer-events:none;
}
.cov-hud {
    position:absolute; z-index:5; left:.72rem; top:.62rem; right:.72rem;
    display:flex; justify-content:space-between; align-items:center; gap:.6rem;
    color:rgba(219,225,255,.72);
    font-family:var(--font-mono); font-size:.59rem; letter-spacing:.04em;
    text-shadow:0 1px 8px #02030a;
    pointer-events:none;
}
.cov-live { display:flex; align-items:center; gap:.38rem; text-transform:uppercase; letter-spacing:.11em; }
.cov-live i {
    width:6px; height:6px; border-radius:50%; background:#72f0d1;
    box-shadow:0 0 0 3px rgba(114,240,209,.1), 0 0 10px #72f0d1;
}
.cov-live.is-paused i { background:#d7bd69; box-shadow:0 0 0 3px rgba(215,189,105,.1); }
.cov-rule-stamp {
    position:absolute; z-index:5; right:.72rem; bottom:.64rem;
    display:flex; align-items:center; gap:.38rem;
    padding:.28rem .44rem;
    border:1px solid rgba(190,166,255,.17); border-radius:6px;
    background:rgba(4,5,14,.48); color:rgba(224,214,255,.68);
    backdrop-filter:blur(6px);
    font-family:var(--font-mono); font-size:.55rem; letter-spacing:.06em;
    pointer-events:none;
}
.cov-rule-stamp i { color:#d7bd69; font-style:normal; }
.cov-cursor {
    position:absolute; z-index:7; left:50%; top:50%;
    width:15px; height:15px; translate:-50% -50%;
    border:1px solid rgba(255,255,255,.9); border-radius:2px;
    box-shadow:0 0 0 1px rgba(2,3,8,.8), 0 0 14px rgba(191,164,255,.75);
    opacity:0; pointer-events:none;
}
.cov-cursor.is-visible { opacity:1; }
.cov-tooltip {
    position:absolute; z-index:9; display:none; max-width:225px;
    padding:.46rem .58rem;
    border:1px solid rgba(189,158,255,.3); border-radius:7px;
    background:rgba(3,4,12,.91); color:#e7e5f6;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
    font-family:var(--font-mono); font-size:.59rem; line-height:1.46;
    pointer-events:none;
}
.cov-tooltip.is-visible { display:block; }

.cov-bar { gap:.38rem; }
.cov-budget {
    display:inline-flex; align-items:center; gap:2px;
    padding:2px; border:1px solid var(--line); border-radius:8px; background:var(--surface);
}
.cov-budget > span {
    padding:0 .36rem; color:var(--ink-4); font-family:var(--font-mono);
    font-size:.57rem; letter-spacing:.08em; text-transform:uppercase;
}
.cov-budget button {
    border:0; border-radius:6px; padding:.3rem .46rem;
    background:transparent; color:var(--ink-3); cursor:pointer;
    font-family:var(--font-mono); font-size:.62rem;
}
.cov-budget button:hover { color:var(--ink); background:var(--raised); }
.cov-budget button.is-active { color:#190f29; background:linear-gradient(135deg, #c6a5ff, #e4c86f); font-weight:600; }
.cov-budget button i { font-style:normal; font-size:.83em; opacity:.72; }
.cov-speed-label { align-items:center; gap:.4rem; }
.cov-speed-label input { width:94px; }

.cov-monitor { display:grid; grid-template-columns:minmax(0, 1fr) 220px; gap:.65rem; }
.cov-chart-card,
.cov-ledger {
    min-width:0; padding:.68rem .75rem .42rem;
    border:1px solid var(--line); border-radius:var(--radius-sm);
    background:linear-gradient(180deg, color-mix(in srgb, #9d78ed 4%, transparent), transparent), var(--surface);
}
.cov-chart-card > div { display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; }
.cov-chart-card b { font-size:.7rem; font-weight:600; }
.cov-chart-card span { color:var(--ink-4); font-family:var(--font-mono); font-size:.5rem; line-height:1.5; text-align:right; }
.cov-chart-card canvas { display:block; width:100%; height:72px; margin-top:.1rem; }
.cov-dot { display:inline-block; width:5px; height:5px; margin:0 2px 1px 5px; border-radius:50%; }
.cov-dot--population { background:#8be6cf; }
.cov-dot--births { background:#e2c56f; }
.cov-dot--denied { background:#e67ea6; }
.cov-ledger { display:grid; grid-template-columns:repeat(3, 1fr); gap:.38rem .55rem; align-content:center; padding:.65rem; }
.cov-ledger div span { display:block; color:var(--ink-4); font-family:var(--font-mono); font-size:.51rem; letter-spacing:.08em; text-transform:uppercase; }
.cov-ledger div b { font-family:var(--font-mono); font-size:.88rem; font-weight:500; font-variant-numeric:tabular-nums; }
.cov-ledger-agreement { grid-column:1 / -1; display:grid; grid-template-columns:1fr auto; align-items:end; gap:.12rem .5rem; }
.cov-ledger-agreement > i { grid-column:1 / -1; display:block; height:3px; border-radius:2px; background:var(--raised); overflow:hidden; }
.cov-ledger-agreement > i em { display:block; width:0; height:100%; background:linear-gradient(90deg, #d56c9c, #d9c46f, #75dfc8); transition:width .3s var(--ease); }
.cov-notice { border-color:color-mix(in srgb, #a77df0 28%, var(--line)); }
.cov-notice svg { color:#b28aff; }

.cov-panel { overflow-x:hidden; }
.cov-presets { display:grid; gap:.34rem; }
.cov-presets button {
    position:relative; display:flex; align-items:center; justify-content:space-between; gap:.55rem;
    width:100%; padding:.55rem .62rem; border:1px solid var(--line); border-radius:8px;
    background:var(--surface); color:var(--ink-2); text-align:left; cursor:pointer;
}
.cov-presets button:hover { border-color:color-mix(in srgb, #ab86ed 48%, var(--line)); color:var(--ink); }
.cov-presets button.is-active {
    border-color:color-mix(in srgb, #b18aff 54%, var(--line));
    background:linear-gradient(90deg, color-mix(in srgb, #946be2 11%, var(--surface)), var(--surface)); color:var(--ink);
}
.cov-presets button.is-active::before { content:""; position:absolute; left:-1px; top:20%; bottom:20%; width:2px; background:#b48bff; }
.cov-presets span { font-size:.74rem; font-weight:600; }
.cov-presets small { color:var(--ink-4); font-family:var(--font-mono); font-size:.52rem; }
.cov-views,
.cov-tools { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.3rem; }
.cov-views button,
.cov-tools button {
    min-width:0; padding:.43rem .22rem; border:1px solid var(--line); border-radius:7px;
    background:var(--surface); color:var(--ink-3); cursor:pointer; font-family:var(--font-mono); font-size:.61rem;
}
.cov-views button:hover,
.cov-tools button:hover { color:var(--ink); border-color:var(--line-strong); }
.cov-views button.is-active,
.cov-tools button.is-active { color:#efeaff; border-color:#9d75e0; background:color-mix(in srgb, #8e66d4 18%, var(--surface)); }
.cov-key {
    display:flex; align-items:center; gap:.42rem; min-height:1.8rem; margin-top:.38rem; padding:.35rem .46rem;
    border-radius:6px; background:var(--surface); color:var(--ink-4); font-family:var(--font-mono); font-size:.52rem; line-height:1.35;
}
.cov-key i { flex:none; width:22px; height:7px; border-radius:2px; background:linear-gradient(90deg, #67e0ca, #9b79ee, #e8c86d); }
.cov-tool-note { min-height:2.6rem; margin:.45rem 0 0; color:var(--ink-3); font-size:.69rem; line-height:1.45; }

.cov-compass-wrap {
    display:grid; grid-template-columns:auto 1fr; gap:.55rem .8rem; align-items:center;
    margin-top:.7rem; padding:.68rem; border:1px solid var(--line); border-radius:9px; background:var(--surface);
}
.cov-compass-wrap > span { color:var(--ink-4); font-family:var(--font-mono); font-size:.56rem; letter-spacing:.08em; text-transform:uppercase; }
.cov-compass {
    grid-row:1 / span 3; grid-column:2;
    justify-self:end; display:grid; grid-template-columns:repeat(3, 27px); grid-template-rows:repeat(3, 27px); gap:2px;
}
.cov-compass button {
    padding:0; border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--ink-3); cursor:pointer; font-size:.9rem; line-height:1;
}
.cov-compass button:hover { color:var(--ink); }
.cov-compass button.is-active { color:#1b1028; border-color:transparent; background:#c6a5ff; }
.cov-compass i { border-radius:50%; background:radial-gradient(circle, #ddc16c 0 2px, transparent 3px), var(--panel); }
.cov-compass-wrap label { display:grid; gap:.18rem; color:var(--ink-4); font-family:var(--font-mono); font-size:.53rem; text-transform:uppercase; }
.cov-compass-wrap input { width:105px; }
.cov-lineage-button {
    width:max-content; padding:.26rem .42rem; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink-3); cursor:pointer; font-family:var(--font-mono); font-size:.55rem;
}
.cov-lineage-button span { color:#d7bd69; }

.cov-stats { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.42rem; }
.cov-stats div { padding:.48rem .55rem; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
.cov-stats span { display:block; color:var(--ink-4); font-family:var(--font-mono); font-size:.5rem; letter-spacing:.07em; text-transform:uppercase; }
.cov-stats b { font-family:var(--font-mono); font-size:.84rem; font-weight:500; font-variant-numeric:tabular-nums; }

.cov-observation {
    min-height:10.2rem; margin-top:.75rem; padding:.83rem .88rem;
    border:1px solid color-mix(in srgb, #a980f0 27%, var(--line)); border-radius:9px;
    background:
        radial-gradient(circle at 100% 0, rgba(157,113,236,.1), transparent 45%),
        var(--surface);
}
.cov-observation h3 { margin:.3rem 0 .38rem; font-size:.95rem; line-height:1.2; }
.cov-observation p { margin:0; color:var(--ink-3); font-size:.72rem; line-height:1.52; }
.cov-inspector { min-height:9.7rem; margin-top:.6rem; padding:.8rem .85rem; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.cov-inspector > div:first-child { display:flex; justify-content:space-between; gap:.5rem; }
.cov-inspector > div:first-child b { color:var(--ink-4); font-family:var(--font-mono); font-size:.54rem; font-weight:500; }
.cov-inspector h3 { margin:.3rem 0 .3rem; font-size:.87rem; }
.cov-inspector p { min-height:2.2rem; margin:0; color:var(--ink-3); font-size:.69rem; line-height:1.45; }
.cov-inspector-ledger { display:grid; grid-template-columns:repeat(2, 1fr); gap:.22rem .6rem; margin-top:.45rem; padding-top:.45rem; border-top:1px solid var(--line-soft); }
.cov-inspector-ledger[hidden] { display:none; }
.cov-inspector-ledger span { display:flex; justify-content:space-between; color:var(--ink-4); font-family:var(--font-mono); font-size:.51rem; }
.cov-inspector-ledger b { color:var(--ink-2); font-weight:500; }
.cov-detail { display:flex; width:100%; }
.cov-detail button { flex:1; }

.cov-prose h2 { scroll-margin-top:calc(var(--nav-h) + 20px); }
.cov-rule-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:.65rem; margin:1.3rem 0 2rem; }
.cov-rule-grid > div { position:relative; padding:1rem .9rem .95rem; border:1px solid var(--line); border-radius:10px; background:var(--surface); overflow:hidden; }
.cov-rule-grid > div > span { position:absolute; right:.65rem; top:.5rem; color:var(--ink-4); font-family:var(--font-mono); font-size:.52rem; }
.cov-rule-grid h3 { margin:.6rem 0 .3rem; font-size:.92rem; }
.cov-rule-grid p { margin:0; color:var(--ink-3); font-size:.73rem; line-height:1.48; }
.cov-rule-icon { display:block; width:38px; height:25px; position:relative; }
.cov-rule-icon::before,
.cov-rule-icon::after { content:""; position:absolute; }
.cov-rule-icon--count { background:radial-gradient(circle, #a88aee 0 2px, transparent 3px) 0 0/12px 12px; }
.cov-rule-icon--count::after { width:7px; height:7px; left:15px; top:9px; border:1px solid #e0c66d; }
.cov-rule-icon--promise::before { inset:3px 4px; background:linear-gradient(26deg, transparent 46%, #a88aee 47% 51%, transparent 52%), linear-gradient(-26deg, transparent 46%, #dfc66e 47% 51%, transparent 52%); }
.cov-rule-icon--agree::before { left:14px; top:7px; width:9px; height:9px; border-radius:50%; background:#dfc66e; box-shadow:-12px -6px 0 -2px #9c7bdf, 12px -6px 0 -2px #9c7bdf; }
.cov-rule-icon--turn::before { left:4px; top:11px; width:28px; height:1px; background:#a98be8; transform:rotate(-18deg); }
.cov-rule-icon--turn::after { right:3px; top:2px; border:5px solid transparent; border-left-color:#dfc66e; transform:rotate(-18deg); }
.cov-equation {
    display:grid; grid-template-columns:1fr auto 1fr auto 1.15fr; gap:.75rem; align-items:stretch;
    margin:1.3rem 0 2rem; padding:1rem; border:1px solid color-mix(in srgb, #9b75e1 25%, var(--line)); border-radius:12px;
    background:linear-gradient(135deg, color-mix(in srgb, #966fdf 7%, var(--surface)), var(--surface));
}
.cov-equation > i { align-self:center; color:#d9c16c; font-family:var(--font-mono); font-style:normal; }
.cov-equation > div { padding:.55rem .65rem; }
.cov-equation span { display:block; color:var(--ink-4); font-family:var(--font-mono); font-size:.57rem; letter-spacing:.09em; text-transform:uppercase; }
.cov-equation b { display:block; margin:.16rem 0; font-family:var(--font-mono); font-size:.85rem; font-weight:500; }
.cov-equation p { margin:0; color:var(--ink-3); font-size:.68rem; line-height:1.35; }
.cov-equation-result { border:1px solid color-mix(in srgb, #dcc46e 28%, var(--line)); border-radius:8px; background:color-mix(in srgb, #dcc46e 4%, transparent); }
.cov-experiments { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.7rem 1.4rem; padding-left:1.25rem; }
.cov-experiments li { padding-left:.25rem; color:var(--ink-2); font-size:.86rem; line-height:1.55; }

@media (max-width:1080px) {
    .cov-shell { grid-template-columns:minmax(0, 1fr); }
}

@media (max-width:760px) {
    .cov-head h1 small { display:block; margin:.45rem 0 0; font-size:.28em; }
    .cov-monitor { grid-template-columns:1fr; }
    .cov-ledger { grid-template-columns:repeat(4, 1fr); }
    .cov-ledger-agreement { grid-column:auto; }
    .cov-rule-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
    .cov-equation { grid-template-columns:1fr; gap:.2rem; }
    .cov-equation > i { justify-self:center; transform:rotate(90deg); }
    .cov-experiments { grid-template-columns:1fr; }
    .cov-panel { display:block; }
    .cov-budget--bar { order:10; width:100%; }
    .cov-budget--bar button { flex:1; }
}

@media (max-width:520px) {
    .cov-hud { font-size:.49rem; }
    .cov-rule-stamp { display:none; }
    .cov-speed-label { width:100%; justify-content:flex-end; }
    .cov-speed-label input { flex:1; max-width:180px; }
    .cov-ledger { grid-template-columns:repeat(2, 1fr); }
    .cov-ledger-agreement { grid-column:1 / -1; }
    .cov-rule-grid { grid-template-columns:1fr; }
    .cov-presets button { min-height:44px; }
}

@media (prefers-reduced-motion:reduce) {
    .cov-ledger-agreement > i em { transition:none; }
    .cov-live i { box-shadow:none; }
}