:root{color-scheme:dark;background:#101316;color:#f0f6f4;font-family:system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0}header{background:#181d21;border-bottom:1px solid #354044}
header a,main{display:block;max-width:42rem;margin:auto;padding:1.1rem}
header a{color:#a6eadd;text-decoration:none;font-weight:700}
main{padding-block:2rem}.brand{color:#88ebd2;font-size:.8rem;letter-spacing:.15em;font-weight:800}
h1{margin:.35rem 0;font-size:clamp(1.8rem,7vw,2.6rem)}h2{margin-top:0;font-size:1.25rem}.muted{color:#b5c8c4}
form,section{margin-top:1.25rem;padding:clamp(1rem,4vw,1.55rem);background:#181d21;border:1px solid #354044;border-radius:1rem}
label,input{display:block}label{margin:.75rem 0 .4rem;font-weight:700}label:first-child{margin-top:0}
input{width:100%;padding:.7rem;background:#101316;border:1px solid #63736e;border-radius:.5rem;color:inherit;font:inherit}
.actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.1rem}
button{padding:.65rem .9rem;border:1px solid #5e716c;border-radius:.55rem;background:#263330;color:inherit;font:inherit;font-weight:700}
button[type=submit]{background:#88ebd2;color:#112b23;border-color:#88ebd2}
button:disabled{opacity:.6}#message{margin-bottom:0;color:#f8d1a4}#message:empty{display:none}
ul{padding:0;list-style:none;margin-bottom:0}li{padding:.8rem 0;border-top:1px solid #354044;overflow-wrap:anywhere}
li small{display:block;color:#b5c8c4;margin-top:.25rem}

#message[data-state="done"]{color:#88ebd2}h3{font-size:1rem;margin:1rem 0 .3rem}
#previous-records{border-top:1px solid #354044;margin-top:.6rem;padding-top:.8rem}
summary{cursor:pointer;color:#b5c8c4;font-weight:650}