:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#173e43;background:#f7f8f2;font-size:16px;line-height:1.55;--teal:#14565c;--lime:#e4efae;--orange:#e9a86d}*{box-sizing:border-box}body{margin:0}.demo-shell{max-width:1080px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:15px;align-items:center;padding-bottom:22px;border-bottom:1px solid #cddbd5}.brand{color:var(--teal);text-decoration:none;font-size:1.5rem;font-weight:850}.brand span{display:block;font-size:.63rem;letter-spacing:.08em}.badge,.pill{display:inline-block;padding:6px 12px;border-radius:30px;background:var(--lime);font-size:.75rem;font-weight:800}.intro{padding:40px 0 26px;max-width:720px}.eyebrow{font-size:.72rem;letter-spacing:.12em;font-weight:800}h1{font-size:clamp(2.9rem,7vw,4.7rem);line-height:1.05;letter-spacing:-.05em;margin:16px 0}h1 em{font-style:normal;color:#a34e26}h2{font-size:1.45rem;line-height:1.3}h3{line-height:1.4}button,.button{font:inherit;font-weight:650;color:var(--teal);background:#fff;border:1px solid #aebfb6;border-radius:12px;padding:11px 17px;cursor:pointer;display:inline-block;text-decoration:none}button:hover,.button:hover{background:#edf2e6}.primary{background:var(--teal);color:#fff;border-color:var(--teal)}.primary:hover{background:#0e4247;color:#fff}button:disabled{opacity:.6;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #aa4f20;outline-offset:3px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.small,small{font-size:.85rem;color:#476363}nav{display:flex;flex-wrap:wrap;gap:10px;padding:18px 0;border-top:1px solid #cddbd5}nav [aria-pressed=true]{background:var(--lime);border-color:#8b9c55}.quiet{background:transparent;font-size:.85rem;margin-left:auto}.cards,.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card,.panel{background:#fff;border:1px solid #d2ded5;border-radius:20px;padding:24px;margin:15px 0}.card{display:flex;flex-direction:column}.card button{margin-top:auto}.card .number{font-size:2rem;color:#9aa970;font-weight:800}.notice{background:#edf3df;border-left:4px solid #879e45;padding:15px 18px;border-radius:0 10px 10px 0;margin:18px 0}.steps{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.steps span{border-bottom:3px solid #d2ded5;padding:7px;font-size:.85rem}.steps .active{border-color:var(--teal);font-weight:750}.visual{background:#f3f6ed;border-radius:15px;padding:16px;margin:18px 0}.visual svg{width:100%;height:auto;max-height:235px}.visual text{font:18px system-ui;fill:#173e43}fieldset{border:0;padding:0;margin:20px 0}legend{font-weight:700;margin-bottom:10px}.option{display:flex;align-items:flex-start;gap:12px;border:1px solid #bdcdc5;border-radius:12px;padding:12px;margin:9px 0;cursor:pointer}.option input{margin-top:6px;accent-color:var(--teal);flex-shrink:0}.option:has(input:checked){background:#e9f1dc;border-color:#5b7849}.feedback{padding:18px;border-radius:12px;background:#fff2de;margin:20px 0}.feedback.correct{background:#e4efdc}textarea{display:block;min-height:120px;width:100%;font:inherit;border:1px solid #a5b9b0;border-radius:12px;padding:12px;margin:10px 0 16px}label{font-weight:550}table{border-collapse:collapse;width:100%;font-size:.94rem}th,td{text-align:left;padding:12px;border-bottom:1px solid #d5ded6;vertical-align:top}.scroll{overflow:auto}caption{text-align:left;font-weight:700;padding:8px 0}.stat{padding:18px;border-radius:15px;background:#edf3df}.stat b{font-size:2rem;display:block}.trace{padding:16px 0;border-bottom:1px solid #d5ded6}.trace p{white-space:pre-wrap;overflow-wrap:anywhere}.closing{border-top:1px solid #cddbd5;margin-top:34px;padding:24px 0}.closing .button{margin:5px 8px 5px 0}footer{font-size:.8rem;color:#476363;padding:20px 0;border-top:1px solid #cddbd5}footer a{display:block;color:var(--teal);margin-top:10px}a{color:var(--teal)}@media(max-width:650px){.demo-shell{padding:16px}.cards,.stats{grid-template-columns:1fr}.card{margin:0}.intro{padding-top:25px}.panel{padding:17px}header{align-items:flex-start}.badge{font-size:.65rem}.quiet{margin-left:0}.actions button{flex:1}h1{font-size:3rem}}
