.page__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 20px; } .page__title { margin: 0; font-size: 1.5rem; font-weight: 500; letter-spacing: -.01em; color: var(--zk-ink); } .page__sub { margin: 3px 0 0; font-size: .84rem; color: var(--zk-muted); } .page__count { font-size: 1.35rem; font-weight: 500; color: var(--zk-blue); background: var(--zk-white); border: 1px solid var(--zk-line); border-radius: 6px; padding: 6px 16px; font-variant-numeric: tabular-nums; } .empty { color: var(--zk-muted); font-size: .88rem; padding: 28px 2px; } .notice { background: var(--zk-white); border: 1px solid var(--zk-line); border-left: 3px solid var(--zk-blue); border-radius: 0 6px 6px 0; padding: 16px 20px; max-width: 60ch; } .notice strong { display: block; font-weight: 500; margin-bottom: 6px; } .notice p { margin: 0 0 6px; font-size: .86rem; color: var(--zk-muted); line-height: 1.55; } .notice__detail { font-size: .76rem !important; color: var(--zk-grey) !important; } .notice code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8em; background: var(--zk-tint); border: 1px solid var(--zk-line-soft); border-radius: 3px; padding: 1px 4px; } .grid { width: 100%; border-collapse: collapse; background: var(--zk-white); border: 1px solid var(--zk-line); border-radius: 6px; overflow: hidden; font-size: .86rem; } .grid th { text-align: left; font-size: .68rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--zk-muted); padding: 10px 14px; background: var(--zk-tint); border-bottom: 1px solid var(--zk-line); white-space: nowrap; } .grid td { padding: 11px 14px; border-bottom: 1px solid var(--zk-line-soft); vertical-align: top; } .grid tbody tr:last-child td { border-bottom: none; } .grid tbody tr:hover { background: var(--zk-tint); } .grid .num { text-align: right; font-variant-numeric: tabular-nums; } .grid__sub { font-size: .76rem; color: var(--zk-muted); margin-top: 2px; } .grid__link { color: var(--zk-blue); text-decoration: none; font-weight: 500; } .grid__link:hover { text-decoration: underline; } .chip { display: inline-block; font-size: .72rem; padding: 2px 8px; border-radius: 3px; background: var(--zk-tint-blue); color: var(--zk-blue-dark); border: 1px solid var(--zk-blue-light); } .chip--warn { background: #fdf1e7; color: #93500f; border-color: #f0c69a; }