/* V128 System Manager normalization */
.system-modal, .system-dialog, #system-dialog { --system-gap: 12px; --system-control-height: 38px; --system-radius: 14px; color: var(--text); box-sizing: border-box; }
.system-modal *, .system-dialog *, #system-dialog * { box-sizing: border-box; }
.system-content, .dice-content { flex: 1 1 auto; min-height: 0; padding: 16px; display: grid; grid-template-columns: minmax(180px, 250px) minmax(0, 1fr); gap: 16px; overflow: hidden; }
.system-tabs { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; width: 100%; max-width: 100%; padding: 8px; overflow: auto; border: 1px solid var(--border); border-radius: 16px; background: rgba(0,0,0,.12); }
.system-tab { flex: 1 1 auto; width: auto; max-width: 100%; min-height: var(--system-control-height); padding: 0 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.system-modal .edit-form, .system-dialog .edit-form, .system-settings, .system-search, .system-collection, .system-data-tools, .system-campaigns { display: grid; gap: var(--system-gap); min-width: 0; max-width: 100%; overflow: auto; padding-right: 2px; }
.system-modal .editor-section, .system-dialog .editor-section, .provider-settings-section { display: grid; gap: 10px; min-width: 0; padding: 12px; border-radius: 16px; border: 1px solid var(--border); background: rgba(255,255,255,.04); }
.system-modal .editor-field, .system-dialog .editor-field { display: grid; gap: 6px; min-width: 0; }
.system-modal .editor-field > span, .system-dialog .editor-field > span, .provider-settings-section legend { color: var(--text-muted); font-size: .68rem; font-weight: 1000; letter-spacing: .08em; text-transform: uppercase; }
.system-modal input, .system-modal select, .system-modal textarea, .system-dialog input, .system-dialog select, .system-dialog textarea { width: 100%; min-width: 0; min-height: var(--system-control-height); padding: 8px 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; background: rgba(0,0,0,.24); color: var(--text); font: inherit; line-height: 1.25; }
.system-modal textarea, .system-dialog textarea { min-height: 96px; resize: vertical; }
.system-modal .tool-button, .system-dialog .tool-button, #system-dialog .tool-button, .provider-test-button, .card-render-budget-button { min-height: var(--system-control-height); min-width: var(--system-control-height); width: auto; max-width: 100%; padding: 0 12px; border-radius: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.system-modal .modal-actions, .system-dialog .modal-actions, .system-modal .form-actions, .system-dialog .form-actions, .system-modal .toolbar, .system-dialog .toolbar, .system-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; }
.system-toolbar { justify-content: space-between; }
.system-modal table, .system-dialog table, .system-collection table, .system-campaigns table { table-layout: auto; width: 100%; border-collapse: separate; border-spacing: 0 7px; }
.system-modal th, .system-dialog th, .system-collection th, .system-campaigns th { color: var(--text-muted); font-size: .68rem; font-weight: 1000; letter-spacing: .08em; text-transform: uppercase; text-align: left; padding: 0 10px 4px; }
.system-modal td, .system-dialog td, .system-collection td, .system-campaigns td { min-width: 0; padding: 9px 10px; border-top: 1px solid rgba(255,255,255,.075); border-bottom: 1px solid rgba(255,255,255,.075); background: rgba(255,255,255,.035); color: var(--text-soft); vertical-align: middle; overflow-wrap: anywhere; }
.system-modal tr td:first-child, .system-dialog tr td:first-child, .system-collection tr td:first-child, .system-campaigns tr td:first-child { border-left: 1px solid rgba(255,255,255,.075); border-radius: 12px 0 0 12px; }
.system-modal tr td:last-child, .system-dialog tr td:last-child, .system-collection tr td:last-child, .system-campaigns tr td:last-child { border-right: 1px solid rgba(255,255,255,.075); border-radius: 0 12px 12px 0; white-space: nowrap; width: 1%; }
.system-modal td:last-child .tool-button, .system-dialog td:last-child .tool-button, .system-collection td:last-child .tool-button { margin-left: 4px; }
.settings-help-text { color: var(--text-muted); font-size: .82rem; line-height: 1.45; }
.editor-checkbox, .system-toggle-row { min-height: 44px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 14px; background: rgba(0,0,0,.12); text-transform: none; letter-spacing: normal; cursor: pointer; }
.editor-checkbox input[type="checkbox"], .system-toggle-row input[type="checkbox"] { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; pointer-events: none; }
.editor-checkbox::after, .system-toggle-row::after { content: "OFF"; width: 58px; min-width: 58px; height: 30px; display: inline-flex; align-items: center; justify-content: flex-end; padding: 0 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: var(--text-muted); background: rgba(0,0,0,.24); font-size: .62rem; font-weight: 900; letter-spacing: .06em; box-sizing: border-box; }
.editor-checkbox:has(input[type="checkbox"]:checked)::after, .system-toggle-row:has(input[type="checkbox"]:checked)::after { content: "ON"; justify-content: flex-start; color: #102015; border-color: rgba(76,255,154,.46); background: linear-gradient(180deg, rgba(122,255,174,.96), rgba(49,186,99,.82)); }
@media (max-width: 900px) { .system-content, .dice-content { grid-template-columns: 1fr; overflow: auto; } .system-tabs { max-height: none; } .system-modal td:last-child, .system-dialog td:last-child, .system-collection td:last-child { white-space: normal; width: auto; } }

/* Patch 033H-A - Primitive Visibility */
.system-primitives { align-content: start; }
.primitive-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--system-gap); }
.primitive-summary-card { min-width: 0; padding: 14px; display: grid; gap: 4px; border: 1px solid var(--border); border-radius: var(--system-radius); background: rgba(255,255,255,.04); }
.primitive-summary-card strong { color: var(--gold); font-size: 1.4rem; line-height: 1; }
.primitive-summary-card span { color: var(--text-muted); font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.primitive-record-list { display: grid; gap: 8px; }
.primitive-record-row { min-width: 0; padding: 10px 12px; display: grid; grid-template-columns: minmax(140px, .7fr) minmax(220px, 1.4fr) minmax(120px, .6fr); gap: 10px; align-items: center; border: 1px solid rgba(255,255,255,.075); border-radius: 12px; background: rgba(255,255,255,.035); }
.primitive-record-row strong, .primitive-record-row span, .primitive-record-row small { min-width: 0; overflow-wrap: anywhere; }
.primitive-record-row strong { color: var(--text); }
.primitive-record-row span { color: var(--text-soft); }
.primitive-record-row small { color: var(--text-muted); }
@media (max-width: 900px) { .primitive-summary-grid { grid-template-columns: 1fr; } .primitive-record-row { grid-template-columns: 1fr; } }

/* Patch 033H-C - Primitive Validation Controls */
.primitive-test-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.primitive-test-status { min-height: 1.25rem; margin: 0; }
.primitive-test-status[data-state="success"] { color: var(--success, #7affae); }
.primitive-test-status[data-state="error"] { color: var(--danger, #ef767a); }

/* Patch 033I-A - Relationship Creation Surface */
.primitive-relationship-create-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--system-gap);
}
.primitive-relationship-create-status {
    min-height: 1.25rem;
    margin: 0;
}
.primitive-relationship-create-status[data-state="success"] {
    color: var(--success, #7affae);
}
.primitive-relationship-create-status[data-state="error"] {
    color: var(--danger, #ef767a);
}
@media (max-width: 900px) {
    .primitive-relationship-create-grid {
        grid-template-columns: 1fr;
    }
}

/* Patch 033I-B - Relationship Surface Filtering and Readability */
.system-primitives select {
    color-scheme: dark;
    background-color: rgba(8, 12, 18, .96);
    color: var(--text);
}
.system-primitives select option,
.system-primitives select optgroup {
    background-color: #111820;
    color: #f4f1e8;
}
.system-primitives select:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}
