:root{--bg:#f5f7fb;--card:#fff;--text:#172033;--muted:#637089;--line:#dfe5ef;--blue:#2b6f9f;--gold:#d8a63f;--green:#24947b;--red:#c95a67;--shadow:0 10px 30px rgba(24,37,56,.08)}
*{box-sizing:border-box} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.55}.wrap{max-width:1120px;margin:auto;padding:0 22px}.hero{background:linear-gradient(135deg,#edf5fb,#f7f3e9);padding:54px 0 38px;border-bottom:1px solid var(--line)}h1{font-size:clamp(2rem,5vw,3.7rem);line-height:1.05;margin:.2rem 0 1rem;max-width:920px}h2{margin-top:0;font-size:1.5rem}h3{margin-bottom:.45rem}.eyebrow{font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);font-size:.78rem}.subtitle{font-size:1.12rem;color:var(--muted);max-width:800px}.notice{margin-top:20px;background:#fff8e8;border:1px solid #ead6a2;border-radius:12px;padding:12px 14px;max-width:860px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}main{display:grid;gap:22px;padding-top:28px;padding-bottom:36px}.design-grid,.method-grid,.test-grid,.controls,.results{display:grid;gap:16px}.design-grid{grid-template-columns:repeat(3,1fr)}.design-grid article{border-top:4px solid var(--blue);padding:16px;background:#f9fbfd;border-radius:12px}.design-grid article:nth-child(2){border-color:var(--gold)}.design-grid article:nth-child(3){border-color:var(--green)}.step{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e9f2f8;color:var(--blue);font-weight:800}.controls{grid-template-columns:repeat(3,1fr)}label{font-weight:650}.controls input,.controls select{width:100%;margin-top:8px}.controls output{float:right;color:var(--blue);font-variant-numeric:tabular-nums}.button-row{display:flex;gap:10px;margin-top:20px}button{border:0;border-radius:10px;padding:11px 16px;font-weight:800;background:var(--blue);color:#fff;cursor:pointer}button:hover{filter:brightness(.96)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #87bfe3;outline-offset:2px}.secondary{background:#eef2f6;color:var(--text)}.results{grid-template-columns:repeat(4,1fr)}.metric p{margin:0;color:var(--muted);font-weight:700}.metric strong{display:block;font-size:2rem;margin:.3rem 0;font-variant-numeric:tabular-nums}.metric small{color:var(--muted)}.split-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.badge{padding:7px 11px;border-radius:999px;background:#edf2f7;font-weight:800;font-size:.82rem;white-space:nowrap}.bar-chart{display:grid;gap:18px;margin:24px 0}.bar-row{display:grid;grid-template-columns:150px 1fr 70px;gap:12px;align-items:center}.track{height:18px;background:#e9eef4;border-radius:999px;overflow:hidden}.bar{height:100%;width:0;background:var(--green);transition:width .4s ease}.bar.alt{background:var(--gold)}.interpretation{border-left:4px solid var(--blue);background:#f4f9fc;border-radius:8px;padding:14px 16px}.test-grid{grid-template-columns:repeat(3,1fr)}.testcase{text-align:left;background:#f7f9fc;color:var(--text);border:1px solid var(--line);min-height:120px}.testcase b,.testcase span{display:block}.testcase span{margin-top:8px;font-weight:500;color:var(--muted)}.method-grid{grid-template-columns:repeat(2,1fr)}.method-grid>div{padding:14px;border:1px solid var(--line);border-radius:12px}.muted{color:var(--muted)}.footer{padding-bottom:42px;color:var(--muted);font-size:.92rem}
@media(max-width:850px){.design-grid,.controls,.results,.test-grid,.method-grid{grid-template-columns:1fr 1fr}.results{grid-template-columns:1fr 1fr}}@media(max-width:600px){.design-grid,.controls,.results,.test-grid,.method-grid{grid-template-columns:1fr}.bar-row{grid-template-columns:1fr}.split-head{display:block}.badge{display:inline-block;margin-top:8px}}