*{box-sizing:border-box}
:root{color-scheme:dark}
body{margin:0;background:#10141a;color:#d8e2ed;font:13px Arial,sans-serif}
header{min-height:58px;padding:12px 18px;background:#080b0f;border-bottom:2px solid #37404b;display:flex;align-items:center;justify-content:space-between;gap:10px}
.brand{font-size:22px;font-weight:800;letter-spacing:2px;color:#efefef}.brand span{color:#7ed7ff}
.header-right{display:flex;gap:12px;align-items:center;color:#9db0bf}
main{padding:14px;max-width:900px;margin:auto}
.panel{background:#1b2129;border:1px solid #39424d;border-radius:6px;padding:14px;margin-bottom:12px;box-shadow:0 3px 12px #0006}
h2{font-size:14px;margin:0 0 10px;text-transform:uppercase;letter-spacing:1px}
.lcd{background:#061016;border:2px inset #52606b;padding:12px;color:#8df0ff;min-height:130px;font-family:monospace;display:grid;align-content:center;gap:6px}
.lcd div:first-child{font-size:19px}.lcd div:nth-child(2){font-size:16px}
.controls{display:flex;gap:8px;align-items:center;margin-top:12px}
select,input,button,textarea{font:inherit}select,input,textarea{background:#0d1217;color:#dbe8f2;border:1px solid #536170;padding:8px;border-radius:4px}
select{flex:1;min-width:0}
button{background:#2d3743;color:#fff;border:1px solid #566575;padding:8px 12px;border-radius:4px;cursor:pointer}
button:hover{background:#3b4856}button:disabled{opacity:.5;cursor:not-allowed}
.volume{display:flex;gap:10px;align-items:center;margin-top:12px}.volume input{flex:1}
.links{display:flex;gap:8px;margin-top:10px}.links button{flex:1}
.led{width:14px;height:14px;border-radius:50%;background:#313840;display:inline-block}.led.on{background:#62f279;box-shadow:0 0 12px #62f279}
.letters{display:flex;flex-wrap:wrap;gap:5px}.letters button{min-width:32px;padding:6px}
.actions{display:flex;flex-wrap:wrap;gap:7px}.actions button{flex:1 1 120px}
footer{padding:9px 12px;background:#080b0f;border:1px solid #303944;border-radius:4px;color:#aebdca}
footer[data-kind=error]{color:#ff8c8c}footer[data-kind=warn]{color:#ffd27d}footer[data-kind=ok]{color:#8fffa1}
.modal{position:fixed;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;padding:14px;z-index:10}
.modal[hidden]{display:none}.modal-card{width:min(850px,100%);max-height:92vh;overflow:auto;background:#151a20;border:1px solid #46515d;border-radius:7px;box-shadow:0 20px 80px #000}
.modal-card>main{padding:18px}.modal-close{position:absolute;right:24px;top:18px;font-size:22px;line-height:1;padding:4px 9px}
label{display:block;margin:10px 0;color:#b9c7d4}label input,label textarea,label select{display:block;width:100%;margin-top:5px}
.row{display:flex;gap:8px;align-items:center;margin:8px 0}.row>*{flex:1}
.tabs{display:flex;gap:6px;border-bottom:1px solid #39434e;margin-bottom:12px;padding-bottom:8px}
.chat{height:390px;background:#071017;border:1px solid #42505e;overflow:auto;padding:8px;font-family:monospace}
.ircgrid{display:grid;grid-template-columns:1fr 180px;gap:10px}.ircgrid aside{background:#0b1015;border:1px solid #42505e;padding:10px}.ircgrid aside b{display:block;margin-bottom:8px}.ircgrid #users div{padding:3px}
.eq{display:flex;justify-content:space-around;height:250px;align-items:end}.eq label{display:flex;flex-direction:column;align-items:center;gap:8px}.eq input{writing-mode:vertical-lr;direction:rtl;width:35px;height:190px}
.help{line-height:1.55}.notice{padding:10px;border:1px solid #485766;background:#0c1319;border-radius:4px;margin:10px 0}
@media(max-width:650px){.brand{font-size:16px}.ircgrid{grid-template-columns:1fr}.header-right{font-size:11px}.modal{padding:0}.modal-card{max-height:100vh;border-radius:0;height:100%}.controls{flex-wrap:wrap}.controls select{flex-basis:100%}}