*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:#fbf4ea;color:#3b2516}
header{background:#8a4b1f;color:#fff;padding:14px 16px}h1{margin:0;font-size:1.35rem}.sub{margin:4px 0 0;opacity:.85;font-size:.9rem}
main{padding:12px;max-width:640px;margin:auto}h2{font-size:1.1rem;margin:18px 0 8px}
.big{font-size:1.1rem;padding:14px;border-radius:12px;border:2px solid #b8733f;background:#fff;color:#5a3015;width:100%;margin:6px 0;cursor:pointer;display:block;text-align:center}
.primary{background:#c46a2b;color:#fff;border-color:#c46a2b;font-weight:700}
.card{background:#fff;border-radius:14px;padding:12px;margin:10px 0;border-left:8px solid #d9a066;box-shadow:0 1px 4px #0001}
.card.ready{background:#dff5df;border-left-color:#2e9d3a}.card .cd{font-size:1.5rem;font-weight:700;margin:6px 0}.card.ready .cd{color:#1d7a28}
.card .note{white-space:pre-wrap;background:#fbf4ea;padding:6px;border-radius:8px}.card.ready .note{background:#eefaee}
.acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.acts a,.acts button{flex:1 1 45%;padding:10px;font-size:1rem;border-radius:10px;border:1px solid #b8733f;background:#fff;color:#5a3015;text-align:center;text-decoration:none}
.muted{color:#8a7462;font-size:.9rem}.help{font-size:.85rem;color:#6b5240;margin-top:20px}
dialog{border:none;border-radius:16px;width:min(94vw,520px);padding:16px}label{display:block;margin:10px 0;font-weight:600}
input,textarea{display:block;width:100%;font-size:1.1rem;padding:10px;margin-top:4px;border:1px solid #c9a98a;border-radius:8px;font-family:inherit}
.mic{width:100%;font-size:1.4rem;padding:22px;border-radius:16px;border:none;background:#8a4b1f;color:#fff;touch-action:none;user-select:none;-webkit-user-select:none}
.mic.on{background:#c62828}.mic:disabled{background:#bbb}.row{display:flex;gap:8px}.row .big{flex:1}
#notifBar button{background:#fff3c4;border-color:#e0b300}