.uc { max-width: 62rem; margin: 0 auto; padding: 2rem 1rem 4rem; }
.uc-intro h1 { margin: 0 0 .5rem; }
.uc-intro small { font-size: .5em; color: var(--muted); font-weight: 400; }
.uc-intro p, .uc-foot, .uc-hint { color: var(--muted); }
.uc-hint { font-size: .9rem; margin: .5rem 0; min-height: 1.2em; }
.uc-app { border: 1px solid var(--pill-border); border-radius: 12px; background: var(--pill-bg); overflow: hidden; margin: 1.5rem 0; }
.uc-nav { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; padding: .5rem .75rem; border-bottom: 1px solid var(--pill-border); }
.uc-brand { margin-right: .75rem; }
.uc-nav button { font: inherit; color: inherit; background: none; border: 0; border-radius: 6px; padding: .4rem .75rem; cursor: pointer; }
.uc-nav button[aria-selected="true"] { background: var(--accent); color: var(--accent-fg); }
.uc-user { margin-left: auto; color: var(--muted); font-size: .85rem; }
.uc-badge { background: #c0392b; color: #fff; border-radius: 999px; padding: 0 .4rem; font-size: .75rem; }
.uc-panel { padding: 1rem; }
.uc-panel[hidden] { display: none; }
.uc-panel input, .uc-panel select { font: inherit; color: inherit; background: var(--bg); border: 1px solid var(--pill-border); border-radius: 6px; padding: .45rem .6rem; }
#q { width: 100%; box-sizing: border-box; }
.uc-panel button[type="submit"], #r-csv { font: inherit; background: var(--accent); color: var(--accent-fg); border: 0; border-radius: 6px; padding: .45rem .9rem; cursor: pointer; }
.uc-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.uc-scroll { overflow-x: auto; max-height: 26rem; overflow-y: auto; margin-top: .5rem; }
.uc table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.uc th, .uc td { text-align: left; padding: .4rem .6rem; border-bottom: 1px solid var(--pill-border); white-space: nowrap; }
.uc th { position: sticky; top: 0; background: var(--bg); }
.uc-tag { padding: .1rem .5rem; border-radius: 999px; font-size: .8rem; background: var(--ph-b); }
.uc-tag.bad { background: #c0392b; color: #fff; }
.uc-tag.warn { background: #d68910; color: #fff; }
.uc-tag.ok { background: #1e8449; color: #fff; }
.uc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: .5rem; margin: .75rem 0; }
.uc-kpi { border: 1px solid var(--pill-border); border-radius: 8px; padding: .5rem .75rem; }
.uc-kpi b { display: block; font-size: 1.4rem; }
.uc-kpi span { color: var(--muted); font-size: .8rem; }
.uc-alerts { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.uc-alerts li { border: 1px solid var(--pill-border); border-left: 4px solid #c0392b; border-radius: 6px; padding: .5rem .75rem; }
.uc-alerts li.closed { border-left-color: #1e8449; opacity: .6; }
.uc-alerts small { color: var(--muted); display: block; }
.uc-foot { font-size: .85rem; }
.uc-panel h2 { font-size: 1.05rem; margin: 1rem 0 .4rem; }
.uc-panel h2:first-child { margin-top: 0; }
.uc-list { margin: 0; padding-left: 1.2rem; color: var(--muted); font-size: .9rem; }
.uc-list li { margin-bottom: .3rem; }
.uc code, .uc-sql { font-family: ui-monospace, Menlo, monospace; font-size: .85em; }
.uc-sql { background: var(--bg); border: 1px solid var(--pill-border); border-radius: 6px; padding: .5rem .75rem; margin: .5rem 0; overflow-x: auto; white-space: pre; }