:root{color-scheme:dark;font-family:Arial,sans-serif;background:#061119;color:#e9f4f7}*{box-sizing:border-box}body{margin:0}main{max-width:940px;margin:auto;padding:24px 16px 72px}h1{font-size:clamp(24px,5vw,36px)}h2{font-size:21px}p{line-height:1.55}header p{color:#75dfd0;letter-spacing:.08em}a{color:#80d9ff}section{background:#0c2430;border:1px solid #2b4b5a;border-radius:16px;padding:20px;margin:20px 0}section section{background:#102d3a}label{display:block;margin:15px 0}input,select,button{font:inherit;border:1px solid #527a8b;border-radius:10px;padding:12px;min-height:46px}input,select{display:block;width:100%;margin-top:8px;background:#061922;color:inherit}button{background:#174b48;color:#fff;cursor:pointer;margin:4px 6px 4px 0}button:disabled{opacity:.5;cursor:wait}button[aria-pressed=true]{background:#187053;border:2px solid #80ffba}.toolbar{display:flex;flex-wrap:wrap}.player{padding:14px 0;border-bottom:1px solid #365561}.player strong{display:block;margin-bottom:8px}.states{display:flex;flex-wrap:wrap;gap:5px}.states button{flex:1;min-width:105px;margin:0}#feedback{background:#143c46;border-radius:10px;padding:14px;overflow-wrap:anywhere}#pending{font-weight:bold;color:#ffda87}#comparison{white-space:pre-wrap;line-height:1.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffcf70;outline-offset:3px}[hidden]{display:none!important}@media(max-width:450px){section{padding:14px}main{padding:16px 10px 60px}.states button{font-size:14px;min-width:100px}}
