/* The recorded case folder shares CommonKit's live proof visual language. */
#case-file{margin:42px 0 48px;padding-top:30px;border-top:2px solid var(--ink);scroll-margin-top:24px;min-width:0}
.case-jump{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;font-size:14px;font-weight:500;color:var(--cobalt);text-underline-offset:5px}
#case-file .cf-heading{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:32px;align-items:start;margin-bottom:25px}
#case-file h2{font-size:32px;font-weight:500;letter-spacing:-.03em;line-height:1.15;margin:10px 0 12px}
#case-file .cf-intro{font-size:15px;line-height:1.75;max-width:670px;color:var(--muted);margin:0}
.cf-provenance{border-left:3px solid var(--apricot);padding:5px 0 5px 18px;display:flex;flex-direction:column;gap:8px;font-size:12px;line-height:1.6;color:var(--muted)}
.cf-provenance strong{font-size:14px;font-weight:500;color:var(--ink)}
.cf-allocation{display:grid;grid-template-columns:1.2fr 1fr 1fr;border:1px solid var(--line);margin-bottom:32px;background:#fff;min-width:0}
.cf-allocation>div{display:flex;flex-direction:column;gap:8px;padding:20px 22px;min-width:0}
.cf-allocation>div+div{border-left:1px solid var(--line)}
.cf-allocation .cf-principal{background:#eeeefa}
.cf-allocation span,.cf-allocation small{font-size:12px;line-height:1.55;color:var(--muted)}
.cf-allocation strong{font-size:24px;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.cf-body{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:30px;align-items:start}
.cf-evidence,.cf-trail{min-width:0}
#case-file h3{font-size:22px;line-height:1.2;letter-spacing:-.02em;font-weight:500;margin:0 0 12px}
.cf-fixture-note{font-size:13px;line-height:1.7;margin:0 0 22px;color:var(--muted);max-width:720px}
.cf-evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
.cf-evidence-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--cobalt);padding:20px 18px;min-width:0;animation:cf-enter .28s ease-out both}
.cf-evidence-card:nth-child(2){animation-delay:40ms}.cf-evidence-card:nth-child(3){animation-delay:80ms}.cf-evidence-card:nth-child(4){animation-delay:120ms}
.cf-evidence-card.cf-decision{border-top-color:#a45235;background:#fff9f5}
.cf-card-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:12px;color:var(--muted)}
.cf-index{font-family:ui-monospace,monospace;color:var(--cobalt)}
.cf-role{font-weight:500}
#case-file h4{font-weight:500;font-size:18px;line-height:1.35;letter-spacing:-.02em;margin:0 0 8px}
.cf-account{font-family:ui-monospace,monospace;font-size:11px;line-height:1.7;overflow-wrap:anywhere;color:var(--muted);margin:0 0 12px}
.cf-explanation{font-size:13px;line-height:1.7;margin:12px 0;color:var(--muted)}
.cf-fixture{font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:16px 0 10px;padding:14px;background:#f5f5f2;border-left:2px solid #b8bddb;color:var(--ink)}
.cf-decision .cf-fixture{background:#fbede4;border-left-color:#b66c4d}
.cf-file-status{font-size:12px;line-height:1.6;color:var(--muted);margin:0 0 8px}
.cf-file-status[data-state=match]{color:#3b4483}.cf-file-status[data-state=error]{color:#a52c21}
.cf-links{display:flex;align-items:center;flex-wrap:wrap;gap:0 18px;font-size:12px;line-height:1.7;margin:6px 0}
.cf-links a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
.cf-chain-status{display:block;font-size:12px;line-height:1.6;color:var(--muted);padding-left:12px;position:relative}
.cf-chain-status:before{content:'';width:5px;height:5px;position:absolute;left:0;top:.6em;background:#85889a;border-radius:50%}
.cf-chain-status[data-state=verified]{color:var(--cobalt)}.cf-chain-status[data-state=verified]:before{background:var(--cobalt)}
.cf-chain-status[data-state=mismatch]{color:#ad2d22}.cf-chain-status[data-state=mismatch]:before{background:#ad2d22}
.cf-chain-status[data-state=unverified]{color:#8a4b13}.cf-chain-status[data-state=unverified]:before{background:#8a4b13}
.cf-fingerprints{margin-top:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cf-fingerprints summary{min-height:44px;cursor:pointer;font-size:12px;display:list-item;align-content:center;padding:12px 0;line-height:1.6}
.cf-fingerprints dl{margin:0 0 14px}.cf-fingerprints dt{font-size:11px;font-weight:500;color:var(--muted);margin:12px 0 5px}
.cf-fingerprints dd{font-size:11px;font-family:ui-monospace,monospace;line-height:1.8;overflow-wrap:anywhere;margin:0}
.cf-file-check{padding-top:17px;display:flex;flex-wrap:wrap;gap:10px;align-items:start;min-width:0}
.cf-file-check label{width:100%;font-size:13px;font-weight:500}
.cf-file-check input{font-family:inherit;font-size:12px;line-height:1.6;max-width:100%;min-width:0;width:100%;min-height:44px;color:var(--muted)}
.cf-file-check input::file-selector-button{font:500 12px 'DM Sans',sans-serif;min-height:44px;padding:10px 12px;border:1px solid #9d9fab;border-radius:5px;background:#fff;color:var(--ink);margin-right:8px;cursor:pointer}
.cf-file-check input:hover::file-selector-button{background:#e9ecff;border-color:var(--cobalt)}
.cf-file-check input:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px;border-radius:3px}
#case-file .cf-clear{min-height:44px;font-size:12px;padding:10px 12px;font-weight:400;border-color:var(--line);border-radius:5px}
#case-file .cf-clear:disabled{cursor:default;opacity:.5}
.cf-local-result{font-size:12px;line-height:1.7;color:var(--muted);margin:0;flex:1 1 100%;overflow-wrap:anywhere}
.cf-local-result[data-state=match]{color:#3b4483}.cf-local-result[data-state=mismatch],.cf-local-result[data-state=error]{color:#ad2d22}
.cf-trail{border-left:1px solid var(--line);padding-left:24px}
.cf-trail .eyebrow{font-size:11px;margin:0 0 11px;color:#915039}
.cf-trail-intro{font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 22px}
.cf-events{list-style:none;margin:0;padding:0}
.cf-events>li{position:relative;border-top:1px solid var(--line);padding:17px 0 12px 28px;min-width:0}
.cf-event-number{position:absolute;top:21px;left:0;font-size:11px;font-family:ui-monospace,monospace;color:#915039}
#case-file .cf-events h4{font-size:16px;line-height:1.5;margin:0 0 7px}
.cf-event-description{font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 10px}
.cf-events .cf-account{font-size:11px;margin-bottom:10px}
.cf-events .cf-links{gap:0 13px;margin-bottom:0}
.cf-boundary{display:grid;grid-template-columns:180px minmax(0,1fr) auto;gap:22px;margin-top:28px;padding:22px;background:#eeeefa;border-left:3px solid var(--cobalt);align-items:start}
.cf-boundary strong{font-size:16px;font-weight:500;line-height:1.5}.cf-boundary p{font-size:12px;line-height:1.8;margin:0;color:var(--muted)}.cf-boundary a{font-size:12px;line-height:1.6;display:flex;align-items:center;min-height:44px;max-width:160px}
.cf-loading,.cf-error{font-size:14px;line-height:1.7;color:var(--muted)}.cf-error{color:#ad2d22}
@keyframes cf-enter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.cf-body{grid-template-columns:minmax(0,1fr)}.cf-trail{border-left:0;padding-left:0;padding-top:10px}.cf-events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}.cf-boundary{grid-template-columns:160px minmax(0,1fr)}.cf-boundary a{grid-column:2;max-width:none}.cf-evidence-card{padding:22px}.cf-fixture{font-size:14px}}
@media(max-width:700px){#case-file .cf-heading{grid-template-columns:minmax(0,1fr);gap:18px}#case-file h2{font-size:28px}.cf-provenance{padding-block:0;gap:4px}.cf-allocation{grid-template-columns:1fr 1fr}.cf-allocation .cf-principal{grid-column:1/-1;border-bottom:1px solid var(--line)}.cf-allocation>div{padding:17px}.cf-allocation>div:nth-child(2){border-left:0}.cf-allocation strong{font-size:23px}.cf-evidence-grid,.cf-events{grid-template-columns:1fr}.cf-boundary{grid-template-columns:1fr;gap:10px}.cf-boundary a{grid-column:1}.cf-evidence-card{padding:20px}.cf-fixture{font-size:13px}.cf-events>li{padding-bottom:14px}.cf-body{gap:25px}}
@media(max-width:420px){#case-file{margin-top:30px;padding-top:24px}.cf-allocation strong{font-size:20px}.cf-allocation>div{padding:15px 13px}.cf-allocation .cf-chain-status{font-size:11px}.cf-evidence-card{padding:18px 16px}.cf-card-top{font-size:12px}.cf-boundary{padding:18px}.cf-file-check input{font-size:11px}}
@media(prefers-reduced-motion:reduce){.cf-evidence-card{animation:none}.cf-file-check input::file-selector-button{transition:none}}
