/* ---------- controls ---------- */
h3{font-size:11px;letter-spacing:.14em;color:var(--dim);text-transform:uppercase;margin:16px 0 8px;border-bottom:1px solid var(--line);padding-bottom:5px}
h3:first-child{margin-top:0}
label.f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0;font-size:12px;color:var(--dim)}
label.f input[type=text]{flex:1;min-width:0}
input[type=text],input[type=number]{background:var(--panel2);border:1px solid var(--line);color:var(--text);font-family:var(--mono);font-size:12px;padding:5px 7px;width:90px}
input[type=number]{width:64px}
input[type=text]:focus,input[type=number]:focus{outline:none;border-color:var(--sky)}
select{background:var(--panel2);border:1px solid var(--line);color:var(--text);font-family:var(--mono);font-size:11px;padding:5px;max-width:190px}
input[type=color]{width:34px;height:26px;border:1px solid var(--line);background:var(--panel2);padding:2px;cursor:pointer}
input[type=range]{flex:1;accent-color:var(--acid)}
input[type=checkbox]{accent-color:var(--acid);width:15px;height:15px}
.btn{background:var(--panel2);border:1px solid var(--line);color:var(--text);font-family:var(--mono);font-size:12px;padding:6px 10px;cursor:pointer;width:100%;margin:3px 0}
.btn:hover{border-color:var(--acid);color:var(--acid)}
.btn.danger:hover{border-color:var(--threat);color:var(--threat)}
.btn.on{border-color:var(--acid);color:var(--acid)}
.row{display:flex;gap:6px}
.row .btn{flex:1}

/* entity list */
.elist{display:flex;flex-direction:column;gap:4px;margin-bottom:6px}
.elist .item{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--panel2);border:1px solid var(--line);cursor:pointer}
.elist .item:hover{border-color:var(--dim)}
.elist .item.sel{border-color:var(--acid)}
.elist .item .ic{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.elist .item .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.elist .item .meta{color:var(--dim);font-size:10px}

/* icon picker */
.icons{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:6px 0}
.icons button{background:var(--panel2);border:1px solid var(--line);font-size:16px;padding:5px 0;cursor:pointer}
.icons button.sel{border-color:var(--acid);background:#1c2a14}

/* zone tabs */
.ztabs{display:flex;gap:3px;margin:6px 0}
.ztabs button{flex:1;background:var(--panel2);border:1px solid var(--line);color:var(--dim);font-family:var(--mono);font-size:10px;padding:6px 1px;cursor:pointer}
.ztabs button.on[data-z=cast]{border-color:var(--sky);color:var(--sky)}
.ztabs button.on[data-z=dmg]{border-color:var(--threat);color:var(--threat)}
.ztabs button.on[data-z=tag]{border-color:var(--ember);color:var(--ember)}
.ztabs button.on[data-z=hmap]{border-color:var(--viol);color:var(--viol)}
.ztabs button.on[data-z=push]{border-color:var(--gold);color:var(--gold)}

/* ability checkboxes */
.abchecks label{display:flex;align-items:center;gap:8px;padding:4px 2px;font-size:12px;cursor:pointer;color:var(--text)}

.note{color:var(--dim);font-size:11px;line-height:1.5;margin:6px 0}