:root { color-scheme:light; --paper:#f3f0e7; --bright:#fbfaf5; --deep:#e7e2d5; --ink:#17221f; --soft:#56625e; --faint:#7d8581; --line:#cbc8bc; --line-dark:#a8aaa1; --accent:#e2562e; --accent-dark:#b93c1f; --accent-pale:#f8e1d7; --green:#276b5a; --green-pale:#dce9e3; --night:#17221f; --sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif; --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 88% 6%,rgb(39 107 90 / 7%),transparent 30rem),var(--paper); font-family:var(--sans); font-size:18px; line-height:1.5; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; cursor:pointer; }
:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.skip-link { position:fixed; z-index:50; top:8px; left:8px; padding:9px 14px; background:var(--ink); color:white; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.site-header { width:min(1480px,calc(100% - 48px)); min-height:74px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:11px; }
.brand svg { width:var(--icon-size-brand); height:var(--icon-size-brand); overflow:visible; }
.brand circle { fill:var(--bright); stroke:var(--ink); stroke-width:1.4; }
.brand path { fill:none; stroke:var(--ink); stroke-width:1.4; }
.brand span { display:flex; flex-direction:column; line-height:1.05; }
.brand strong { font-size:17px; }
.brand small { margin-top:5px; color:var(--faint); font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.site-header nav { display:flex; align-items:center; gap:23px; font-size:14px; font-weight:680; }
.site-header nav a { display:inline-flex; align-items:center; gap:5px; }
.site-header nav a:hover { color:var(--accent-dark); }
.kernel-badge { display:inline-flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid var(--line); border-radius:999px; color:var(--soft); font-family:var(--mono); font-size:11px; letter-spacing:.07em; text-transform:uppercase; }
.kernel-badge i { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px var(--green-pale); }
.overline { margin:0; color:var(--faint); font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.hero { width:min(1380px,calc(100% - 72px)); min-height:470px; margin:0 auto; display:grid; grid-template-columns:165px minmax(0,1fr) 250px; align-items:end; gap:25px; padding:82px 0 76px; }
.hero-index { align-self:start; margin-top:9px; color:var(--faint); font-family:var(--mono); font-size:13px; line-height:1.7; letter-spacing:.14em; }
.hero h1 { margin:15px 0 20px; font-family:var(--serif); font-size:clamp(52px,6.5vw,94px); font-weight:400; line-height:.92; letter-spacing:-.05em; }
.hero h1 em { color:var(--green); font-weight:400; }
.hero-copy>p:last-child { max-width:760px; margin:0; color:var(--soft); font-family:var(--serif); font-size:21px; line-height:1.45; }
.hero-equation { padding-left:25px; border-left:1px solid var(--line-dark); }
.hero-equation span { color:var(--faint); font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.hero-equation strong { display:block; margin:8px 0 3px; font-family:var(--serif); font-size:31px; font-weight:400; }
.hero-equation p { margin:0; color:var(--green); font-family:var(--mono); font-size:13px; }
.lab { width:min(1540px,calc(100% - 32px)); margin:0 auto 120px; border:1px solid var(--line-dark); background:var(--bright); box-shadow:0 20px 60px rgb(40 47 43 / 8%); }
.lab-header { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:13px 20px; border-bottom:1px solid var(--line); }
.lab-header>div { display:flex; align-items:center; gap:14px; }
.section-number { display:inline-grid; width:32px; height:32px; place-items:center; border:1px solid var(--line-dark); border-radius:50%; color:var(--faint); font-family:var(--mono); font-size:11px; }
.lab-header h2 { margin:2px 0 0; font-size:18px; }
.lab-header>p { max-width:450px; margin:0; color:var(--faint); font-size:12px; text-align:right; }
.lab-grid { display:grid; grid-template-columns:285px minmax(420px,1fr) minmax(340px,.78fr); }
.controls { display:flex; flex-direction:column; padding:25px 20px; border-right:1px solid var(--line); background:#f5f3ec; }
.controls>div:first-child { margin-bottom:18px; }
.controls h3 { margin:3px 0 5px; font-size:20px; }
.controls>div:first-child>p:last-child { margin:0; color:var(--faint); font-size:13px; }
.controls>button:not(.reset-action) { min-height:70px; display:grid; grid-template-columns:23px 1fr 34px; align-items:center; gap:7px; padding:10px 9px; border:0; border-top:1px solid var(--line); background:transparent; text-align:left; }
.controls>button:not(.reset-action):last-of-type { border-bottom:1px solid var(--line); }
.controls>button:not(.reset-action):hover,.controls>button.is-active { background:var(--deep); }
.controls>button.is-active { box-shadow:inset 3px 0 var(--accent); }
.controls button>span { color:var(--accent-dark); font-family:var(--mono); font-size:10px; }
.controls button div { display:flex; flex-direction:column; }
.controls button strong { font-size:13px; }
.controls button small { margin-top:2px; color:var(--faint); font-size:10px; }
.controls button>i { display:grid; place-items:center end; color:var(--soft); font-style:normal; }
.controls button>i .ui-icon { width:var(--icon-size-action); height:var(--icon-size-action); }
.controls .safe-action>span,.controls .safe-action>i { color:var(--green); }
.reset-action { margin-top:14px; padding:8px 10px; border:1px solid var(--line-dark); background:transparent; font-size:11px; font-weight:700; }
.reset-action i { float:right; }
.permutation-counter { margin-top:auto; padding:13px; border:1px solid var(--line); background:var(--bright); }
.permutation-counter span,.permutation-counter small { display:block; color:var(--faint); font-family:var(--mono); font-size:9px; letter-spacing:.05em; text-transform:uppercase; }
.permutation-counter strong { display:block; margin:3px 0; color:var(--green); font-family:var(--serif); font-size:28px; font-weight:400; }
.input-stage { min-width:0; border-right:1px solid var(--line); }
.input-stage>header,.identity-stage>header { min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 16px; border-bottom:1px solid var(--line); }
.input-stage h3 { margin:2px 0 0; font-family:var(--serif); font-size:22px; font-weight:400; }
.input-stage>header>span { padding:4px 6px; background:var(--deep); color:var(--faint); font-family:var(--mono); font-size:9px; letter-spacing:.05em; text-transform:uppercase; }
.graph-frame { min-height:330px; display:grid; place-items:center; background:linear-gradient(rgb(23 34 31 / 2%) 1px,transparent 1px),linear-gradient(90deg,rgb(23 34 31 / 2%) 1px,transparent 1px); background-size:24px 24px; }
.graph-frame svg { display:block; width:min(420px,90%); height:310px; overflow:visible; }
.input-graph-edges path { fill:none; stroke:var(--green); stroke-width:2.3; }
.input-graph-edges .role-edge { stroke:var(--accent-dark); stroke-dasharray:6 4; }
.graph-frame marker path { fill:var(--green); }
.graph-frame marker.role-marker path { fill:var(--accent-dark); }
.input-graph-nodes circle { fill:var(--bright); stroke:var(--ink); stroke-width:1.8; }
.input-graph-nodes text { fill:var(--ink); font-family:var(--mono); font-size:12px; font-weight:700; text-anchor:middle; dominant-baseline:middle; }
.input-record { border-top:1px solid var(--line); }
.input-record>span { display:block; padding:8px 14px; color:var(--faint); font-family:var(--mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }
.input-record ol { margin:0; padding:0; list-style:none; }
.input-record li { display:grid; grid-template-columns:25px 1fr auto; gap:8px; padding:7px 14px; border-top:1px solid var(--line); }
.input-record li>span { color:var(--faint); font-family:var(--mono); font-size:9px; }
.input-record code { font-family:var(--mono); font-size:11px; }
.input-record small { color:var(--faint); font-family:var(--mono); font-size:9px; }
.identity-stage { min-width:0; display:flex; flex-direction:column; background:#f5f3ec; }
.identity-stage>header>span { display:inline-flex; align-items:center; gap:7px; padding:5px 7px; background:var(--green-pale); color:var(--green); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.identity-stage>header>span i { width:6px; height:6px; border-radius:50%; background:currentColor; }
.identity-stage[data-result="changed"]>header>span { background:var(--accent-pale); color:var(--accent-dark); }
.identity-result { padding:25px 20px 20px; }
.identity-result>span,.baseline-comparison span,.skeleton-result span { color:var(--faint); font-family:var(--mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }
.identity-result>code { display:block; margin:8px 0 12px; overflow-wrap:anywhere; color:var(--green); font-family:var(--mono); font-size:15px; line-height:1.55; }
.identity-stage[data-result="changed"] .identity-result>code { color:var(--accent-dark); }
.identity-result>p { margin:0; color:var(--soft); font-family:var(--serif); font-size:19px; }
.baseline-comparison { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; padding:17px 20px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--bright); }
.baseline-comparison p { min-width:0; margin:0; }
.baseline-comparison code { display:block; margin-top:3px; overflow:hidden; font-family:var(--mono); font-size:10px; text-overflow:ellipsis; }
.baseline-comparison>i { color:var(--green); font-family:var(--serif); font-size:28px; font-style:normal; }
.identity-stage[data-result="changed"] .baseline-comparison>i { color:var(--accent); }
.skeleton-result { margin-top:auto; padding:19px 20px; background:var(--night); color:white; }
.skeleton-result>div { display:flex; flex-direction:column; }
.skeleton-result code { margin-top:4px; overflow-wrap:anywhere; color:#abc6bd; font-family:var(--mono); font-size:9px; line-height:1.5; }
.skeleton-result>b { display:inline-block; margin-top:11px; color:#99c6b8; font-family:var(--mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }
.skeleton-result>p { margin:7px 0 0; color:#aab4b0; font-size:11px; }
.lab-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:11px 20px; border-top:1px solid var(--line); background:var(--deep); color:var(--faint); font-size:11px; }
.lab-footer p { margin:0; }
.lab-footer p span { margin-right:8px; color:var(--ink); font-family:var(--mono); font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.lab-footer a { display:inline-flex; align-items:center; gap:5px; color:var(--accent-dark); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.policy { width:min(1260px,calc(100% - 72px)); margin:0 auto 120px; }
.section-intro { display:grid; grid-template-columns:55px 230px 1fr; align-items:end; margin-bottom:38px; }
.section-intro h2 { margin:0; font-family:var(--serif); font-size:clamp(42px,5vw,65px); font-weight:400; letter-spacing:-.04em; }
.policy-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-dark); border-left:1px solid var(--line-dark); }
.policy-grid article { min-height:280px; display:flex; flex-direction:column; padding:28px; border-right:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); background:var(--bright); }
.policy-grid article.ignored { box-shadow:inset 0 4px var(--green); }
.policy-grid span { color:var(--faint); font-family:var(--mono); font-size:10px; letter-spacing:.09em; text-transform:uppercase; }
.policy-grid strong { margin:12px 0 9px; font-family:var(--serif); font-size:29px; font-weight:400; }
.policy-grid p { margin:0; color:var(--soft); font-size:14px; }
.policy-grid code { margin-top:auto; padding:10px; border:1px solid var(--line); background:var(--paper); color:var(--green); font-family:var(--mono); font-size:10px; }
.policy-grid article:not(.ignored) code { color:var(--accent-dark); }
.why { min-height:520px; display:grid; grid-template-columns:1.15fr .85fr; align-items:center; background:var(--night); color:white; }
.why>div { padding:80px max(45px,calc((100vw - 1260px)/2)); }
.why>div:first-child { padding-right:60px; }
.why .overline { color:#86938e; }
.why h2 { margin:13px 0 18px; font-family:var(--serif); font-size:clamp(44px,5vw,68px); font-weight:400; letter-spacing:-.04em; }
.why>div:first-child>p:last-child { max-width:720px; margin:0; color:#b6c0bc; font-family:var(--serif); font-size:20px; }
.audit { min-height:100%; display:flex; flex-direction:column; justify-content:center; border-left:1px solid #3a4642; background:linear-gradient(rgb(255 255 255 / 2%) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / 2%) 1px,transparent 1px); background-size:26px 26px; }
.audit>strong { margin-top:12px; color:#99c6b8; font-family:var(--serif); font-size:78px; font-weight:400; letter-spacing:-.06em; }
.audit>span { color:#aab4b0; font-size:13px; }
.audit>div { display:grid; grid-template-columns:repeat(6,1fr); gap:5px; margin:25px 0; }
.audit>div i { height:6px; background:var(--green); }
.audit>a { display:inline-flex; align-items:center; gap:6px; color:#99c6b8; font-size:12px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.site-footer { min-height:100px; display:flex; align-items:center; justify-content:space-between; gap:25px; padding:25px max(30px,calc((100vw - 1380px)/2)); border-top:1px solid var(--line-dark); background:var(--deep); color:var(--soft); font-size:12px; }
.site-footer p { font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.site-footer a { display:inline-flex; align-items:center; gap:5px; font-weight:700; }
@media (max-width:1200px) { .hero{grid-template-columns:90px 1fr 210px} .lab-grid{grid-template-columns:250px 1fr} .identity-stage{grid-column:1/-1;border-top:1px solid var(--line)} .identity-stage{display:grid;grid-template-columns:1fr 1fr} .identity-stage>header{grid-column:1/-1} .baseline-comparison{grid-column:2;grid-row:2} .skeleton-result{grid-column:1/-1} }
@media (max-width:850px) { body{font-size:16px} .site-header{width:calc(100% - 30px)} .site-header nav a:not(:first-child){display:none} .kernel-badge{display:none} .hero{width:calc(100% - 40px);min-height:380px;grid-template-columns:1fr;padding:60px 0}.hero-index,.hero-equation{display:none}.lab{width:100%;border-left:0;border-right:0}.lab-header>p{display:none}.lab-grid{grid-template-columns:1fr}.controls{border-right:0;border-bottom:1px solid var(--line)}.permutation-counter{margin-top:16px}.input-stage{border-right:0}.identity-stage{display:flex}.policy{width:calc(100% - 36px)}.section-intro{display:block}.section-intro .section-number{margin-bottom:25px}.section-intro .overline{margin-bottom:8px}.policy-grid{grid-template-columns:1fr}.policy-grid article{min-height:220px}.why{grid-template-columns:1fr}.why>div{padding:60px 30px}.audit{border-top:1px solid #3a4642;border-left:0} }
@media (max-width:560px) { .brand small{display:none}.site-header nav a{font-size:11px}.hero h1{font-size:47px}.hero-copy>p:last-child{font-size:17px}.lab-header h2{font-size:14px}.lab-header{padding:11px}.controls{padding:20px 14px}.graph-frame{min-height:275px}.graph-frame svg{height:260px}.identity-result{padding:20px 15px}.baseline-comparison{padding:14px}.policy h2{font-size:42px}.why h2{font-size:45px}.audit>strong{font-size:64px}.site-footer{display:block}.site-footer p{margin:10px 0} }
@media (prefers-reduced-motion:reduce) { *{scroll-behavior:auto!important;transition-duration:.01ms!important} }