*{box-sizing:border-box}body{margin:0;background:#f4f2ed;color:#1d2a26;font:15px/1.5 system-ui,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:22px 6%;border-bottom:1px solid #d9dfd5}.brand{display:flex;gap:12px;align-items:center;font-weight:800;letter-spacing:.09em;font-size:12px}.brand small{display:block;font-weight:400;letter-spacing:0;color:#66746a}.mark{display:grid;place-items:center;background:#1d4436;color:white;width:38px;height:38px;border-radius:10px;font-size:20px}.tag,.eyebrow{font-size:10px;letter-spacing:.15em;font-weight:800;color:#537166}.tag{border:1px solid #c9d4cb;padding:7px 10px;border-radius:20px}main{max-width:1060px;padding:72px 24px 40px;margin:auto}h1{font:500 clamp(40px,6vw,70px)/1.02 Georgia,serif;letter-spacing:-.045em;margin:15px 0 20px}h1 em{font-weight:400;color:#6d8d77}.intro{max-width:550px;color:#5f6c64;font-size:16px}.panel{background:white;border:1px solid #dce3dc;border-radius:18px;padding:30px;margin-top:48px;box-shadow:0 10px 40px #273c2d0a}.panelhead,.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.panelhead h2{font:500 28px Georgia,serif;margin:5px 0}.panelhead p{margin:0;color:#6b786e}.status{font-size:10px;color:#34755b;background:#edf7ef;padding:7px 10px;border-radius:20px;white-space:nowrap}form{margin:30px 0}label{font-weight:700;font-size:12px}form label{display:block;margin-bottom:8px}.inputrow{display:flex;gap:10px}input,select,button{font:inherit}input{flex:1;min-width:0;border:1px solid #cdd8ce;border-radius:8px;padding:13px}button{border:0;border-radius:8px;background:#214c3a;color:white;padding:12px 18px;font-weight:700;cursor:pointer}button:hover{background:#346b51}:focus-visible{outline:3px solid #c98635;outline-offset:3px}.toolbar{border-top:1px solid #e7ebe6;padding-top:20px}.toolbar h3{margin:0 auto 0 0;font-size:15px}select{padding:8px;border:1px solid #d5ded4;border-radius:8px;background:white}#message{color:#6b786e;font-size:13px;min-height:20px}ul{list-style:none;padding:0;margin:0}li{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #edf0ec;padding:16px 0}.pill{font-size:11px;border-radius:20px;padding:5px 9px;background:#eff2ed;white-space:nowrap}.pill.done{background:#e6f3ea;color:#287049}footer{margin-top:25px;color:#7b897e;font-size:12px}footer span{padding:0 7px}@media(max-width:600px){main{padding-top:45px}.panel{padding:20px}.tag{display:none}.inputrow{flex-direction:column}.panelhead{align-items:flex-start}}

/* Keep pointer feedback brief and interruptible; keyboard actions stay instant. */
button { transition: transform 140ms cubic-bezier(.23, 1, .32, 1); }
button.pointer-pressed { transform: scale(.97); }
.demo-note { margin: 8px 0 0; color: #66746a; font-size: 12px; }
@media (hover: none) { button:hover { background: #214c3a; } }
@media (prefers-reduced-motion: reduce) {
  button { transition: none; }
  button.pointer-pressed { transform: none; }
}