*{box-sizing:border-box}
html,body{margin:0;padding:0;font:14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
body{max-width:520px;margin:0 auto;padding:12px}
header{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #8884;padding-bottom:8px;margin-bottom:12px}
h1{font-size:18px;margin:0}
#who{display:flex;align-items:center;gap:8px;font-size:13px}
#who[hidden]{display:none}
button{font:inherit;padding:8px 12px;border:1px solid #8888;background:#fff2;border-radius:4px;cursor:pointer}
button:hover{background:#8881}
button:disabled{opacity:.5;cursor:default}
button[type=submit]{background:#1a73e8;color:#fff;border-color:#1a73e8;width:100%}
button[type=submit]:hover{background:#1668d6}
form{display:grid;gap:12px;margin:8px 0}
label{display:grid;gap:4px;font-size:13px;color:#666}
@media (prefers-color-scheme:dark){label{color:#aaa}}
input,select,textarea{font:inherit;padding:8px;border:1px solid #8888;border-radius:4px;background:transparent;color:inherit;width:100%}
#strategy,#instrument,#entry,#sl,#tp{font-size:18px;font-weight:700}
textarea{resize:vertical;font-family:inherit}
.row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
@media (max-width:480px){.row{grid-template-columns:1fr}}
.error{color:#c33;min-height:1em;font-size:13px;margin:0}
.status{min-height:1em;font-size:13px;margin:0}
.status.ok{color:#2e7d32}
.status.warn{color:#b26a00}
.status.err{color:#c33}
@media (prefers-color-scheme:dark){
  body{background:#111;color:#eee}
  input,select,textarea,button{color:#eee}
  button:not([type=submit]){background:#222;border-color:#444}
  button:not([type=submit]):hover{background:#333}
  input,select,textarea{background:#1a1a1a;border-color:#333}
}
