#ap-wrap { padding: 4px 2px 40px; max-width: 1100px; }
#ap-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
#ap-toolbar select, #ap-toolbar input { background: var(--s1); color: var(--text); border: 1px solid var(--border); border-radius: 8px; padding: 6px 10px; font: inherit; font-size: 13px; }
#ap-toolbar input { min-width: 200px; }
#ap-toolbar .ap-spacer { flex: 1; }
#ap-meta { color: var(--text3); font-size: 12px; }
.ap-note { background: var(--amber-dim); border: 1px solid var(--amber); color: var(--text); border-radius: 10px; padding: 10px 14px; font-size: 13px; margin-bottom: 14px; }
.ap-client { margin: 18px 0 6px; display: flex; align-items: baseline; gap: 10px; cursor: pointer; user-select: none; }
.ap-client h3 { margin: 0; font-size: 15px; font-weight: 600; }
.ap-client .ap-count { color: var(--text3); font-size: 12px; }
.ap-client .ap-warn { color: var(--amber); font-size: 12px; }
.ap-date { margin: 10px 0 4px 2px; font-size: 12px; color: var(--text3); text-transform: none; letter-spacing: .02em; }
.ap-date.overdue { color: var(--red-text); }
.ap-row { display: flex; gap: 12px; align-items: center; background: var(--s1); border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; margin-bottom: 6px; cursor: pointer; }
.ap-row:hover { border-color: var(--border2); background: var(--s2); }
.ap-main { flex: 1; min-width: 0; }
.ap-title { font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.ap-title a { color: var(--indigo-text); text-decoration: none; margin-right: 8px; font-weight: 600; font-size: 12px; }
.ap-sub { color: var(--text3); font-size: 12px; margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px 12px; }
.ap-chip { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 11px; font-weight: 500; border: 1px solid var(--border2); color: var(--text2); white-space: nowrap; }
.ap-chip.link { background: var(--indigo-dim); color: var(--indigo-text); border-color: transparent; }
.ap-chip.viewed { background: #3b82f620; color: #7db3fb; border-color: transparent; }
.ap-chip.approved { background: var(--green-dim); color: var(--green); border-color: transparent; }
.ap-chip.changes { background: var(--amber-dim); color: var(--amber); border-color: transparent; }
.ap-chip.expired, .ap-chip.revoked { background: var(--red-dim); color: var(--red-text); border-color: transparent; }
.ap-actions { display: flex; gap: 6px; flex: none; }
.ap-actions .btn { font-size: 12px; padding: 5px 10px; }
.ap-empty { color: var(--text3); padding: 40px 10px; text-align: center; }
.ap-modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 900; display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px; overflow: auto; }
.ap-modal { background: var(--s1); border: 1px solid var(--border2); border-radius: 14px; width: 100%; max-width: 620px; padding: 20px 22px; }
.ap-modal h3 { margin: 0 0 4px; font-size: 17px; }
.ap-modal .ap-sub { margin: 0 0 12px; }
.ap-modal h4 { margin: 16px 0 6px; font-size: 12px; color: var(--text3); font-weight: 600; letter-spacing: .02em; }
.ap-urlrow { display: flex; gap: 8px; }
.ap-urlrow input { flex: 1; min-width: 0; background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; font: 12px var(--font-mono); }
.ap-msg { padding: 9px 12px; border-radius: 8px; font-size: 13px; margin: 10px 0; }
.ap-msg.err { background: var(--red-dim); color: var(--red-text); }
.ap-msg.ok { background: var(--green-dim); color: var(--green); }
.ap-msg.warn { background: var(--amber-dim); color: var(--text); }
.ap-hist { font-size: 12px; color: var(--text3); }
.ap-modal-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ap-children { margin: 0; padding-left: 18px; font-size: 13px; color: var(--text2); }
@media (max-width: 720px) { .ap-row { flex-direction: column; align-items: stretch; } .ap-actions { justify-content: flex-start; } }