.studio-server-name-line { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.studio-server-name-line > h2 { min-width: 0; flex: 0 1 auto; }
.studio-server-name-line:has(.studio-service-tag) > h2 { max-width: 55%; }
.studio-server-tags { display: flex; flex: 1; flex-wrap: wrap; gap: 4px; min-width: 0; padding-top: 1px; }
.studio-service-tag, .studio-tag-field { --tag-ink: hsl(var(--tag-hue, 0) 62% 28%); --tag-surface: hsl(var(--tag-hue, 0) 64% 95%); --tag-edge: hsl(var(--tag-hue, 0) 44% 84%); }
:root[data-theme="dark"] .studio-service-tag, :root[data-theme="dark"] .studio-tag-field { --tag-ink: hsl(var(--tag-hue, 0) 62% 78%); --tag-surface: hsl(var(--tag-hue, 0) 34% 19%); --tag-edge: hsl(var(--tag-hue, 0) 32% 32%); }
.studio-service-tag { display: inline-block; max-width: 100%; padding: 1px 6px; border: 1px solid var(--tag-edge); border-radius: 5px; background: var(--tag-surface); color: var(--tag-ink); font-size: .6875rem; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.studio-server-edit-tags > span { flex: 1; }
.studio-server-edit-tags > .studio-icon:last-child { width: 14px; height: 14px; color: var(--muted); }
.studio .studio-server-edit-tags[aria-expanded="true"] { background: var(--hover); }
.studio-tag-editor { position: fixed; z-index: 70; display: grid; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); color: var(--text); box-shadow: 0 10px 32px var(--shadow); overflow: auto; overscroll-behavior: contain; }
.studio-tag-editor > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.studio-tag-editor > header strong { font-size: .8125rem; font-weight: 500; }
.studio-tag-count { color: var(--muted); font-size: .6875rem; font-variant-numeric: tabular-nums; }
.studio-tag-editor form { display: grid; gap: 10px; min-width: 0; margin: 0; }
.studio-tag-fields { display: grid; gap: 6px; }
.studio .studio-tag-field { --field-height: 34px; gap: 5px; padding-inline: 8px 4px; }
.studio .studio-tag-field > .studio-icon { width: 15px; height: 15px; color: var(--tag-ink); background: var(--tag-surface); border-radius: 3px; }
.studio-tag-add-row { display: flex; align-items: center; gap: 6px; }
.studio-tag-add-row { --field-height: 34px; --field-padding-block: 6px; }
.studio .studio-tag-editor button { display: inline-flex; flex: none; align-items: center; justify-content: center; min-height: 30px; margin: 0; padding: 5px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel); color: var(--text); font-size: .75rem; font-weight: 500; }
.studio .studio-tag-editor button:hover:not(:disabled) { background: var(--hover); border-color: var(--border-strong); }
.studio .studio-tag-editor .studio-tag-add { width: 34px; min-height: 34px; padding: 6px; color: var(--accent); }
.studio .studio-tag-editor .studio-tag-delete { width: 26px; min-height: 26px; padding: 4px; border-color: transparent; color: var(--muted); background: transparent; }
.studio .studio-tag-editor .studio-tag-delete:hover:not(:disabled) { color: var(--error); background: var(--error-bg); }
.studio .studio-tag-delete .studio-icon { width: 14px; height: 14px; }
.studio-tag-editor p { margin: 0; line-height: 1.6; font-size: .6875rem; color: var(--muted); }
.studio-tag-editor .studio-tag-empty { padding: 10px 0 4px; text-align: center; font-size: .8125rem; }
.studio-tag-editor .studio-tag-error { color: var(--error); }
.studio-tag-editor footer { display: flex; justify-content: flex-end; gap: 6px; padding-top: 10px; border-top: 1px solid var(--border); }
.studio .studio-tag-editor .studio-tag-cancel { border-color: transparent; color: var(--muted); }
.studio .studio-tag-editor .studio-tag-save { color: var(--accent); }