:root{
  color-scheme:light;
  --ink:#20354a;
  --line:#dfe7ef;
  --blue:#1769e0;
  --blue-dark:#173f6b;
  --blue-deep:#102e52;
  --muted:#718397;
  --good:#35b277;
  --danger:#d35e50;
  --panel:#fff;
  --surface:#f6f8fa;
}
*{box-sizing:border-box}
html{min-width:320px}
body{margin:0;background:var(--surface);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px}
button,input,select{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}

.topbar{height:70px;background:#fff;border-bottom:1px solid #e7edf3;display:flex;align-items:center;justify-content:space-between;padding:0 42px;position:relative;z-index:5}
.brand{display:flex;align-items:center;gap:12px;color:#16324b;text-decoration:none;font-size:16px;font-weight:750}
.brand small{display:block;margin-top:2px;color:#8796a5;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.brand-mark{width:31px;height:31px;position:relative;flex:0 0 auto}
.brand-mark i{position:absolute;width:14px;height:22px;border-radius:3px;transform:skewY(-28deg)}
.brand-mark i:nth-child(1){background:#45b4d8;left:1px;top:5px}
.brand-mark i:nth-child(2){background:#1473e6;left:9px;top:1px}
.brand-mark i:nth-child(3){background:#173e71;left:17px;top:7px}
.top-actions,.tenant-status{display:flex;align-items:center}
.top-actions{gap:14px}
.tenant-status{gap:8px;color:#65778a;font-size:12px}
.status-dot{width:7px;height:7px;background:var(--good);border-radius:50%;box-shadow:0 0 0 3px #e3f6ef;transition:.2s}
.avatar{width:48px;height:48px;border-radius:50%;background:#dceafe;color:#2862a8;display:grid;place-items:center;font-weight:800}
.avatar.small{width:34px;height:34px;background:#183b62;color:#fff;font-size:10px}

.hero{background:linear-gradient(115deg,var(--blue-dark),var(--blue-deep) 63%,#0e2745);min-height:246px;color:#fff;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-80px;bottom:-150px;width:520px;height:350px;border:1px solid #64b8e51f;border-radius:50%;transform:rotate(-20deg);box-shadow:0 0 0 65px #54a9d809,0 0 0 130px #54a9d806}
.hero-inner,.workspace{width:min(1160px,calc(100% - 48px));margin:auto}
.hero-inner{padding:42px 0 38px;position:relative;z-index:1}
.eyebrow{color:#62c6eb;font-size:10px;letter-spacing:.16em;font-weight:800;margin:0 0 7px}
.eyebrow.dark{color:#73869b;margin-bottom:4px}
h1{font-family:Georgia,serif;font-size:36px;line-height:1.12;margin:0 0 8px;font-weight:700}
.hero-copy{margin:0;color:#c5d6e5;font-size:14px;max-width:720px}
.privacy-note{font-size:10px;color:#8eacc6;margin:18px 0 0}
.workspace{padding-bottom:54px}

.filter-card{margin:-30px 0 24px;position:relative;z-index:2;background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:0 8px 26px #1a39530d;padding:18px 20px 20px}
.filter-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:15px}
.filter-heading h2{margin:0;font-size:15px}
.filter-heading p:not(.eyebrow){margin:5px 0 0;color:#7b8b9b;font-size:10px;line-height:1.45}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:10px;align-items:end}
.filters label{display:flex;flex-direction:column;gap:5px;color:#718397;font-size:10px;font-weight:750}
.filters input,.filters select{width:100%;height:40px;background:#fff;border:1px solid #d5dfe8;border-radius:5px;color:#2c4257;padding:0 11px;outline:none;transition:border-color .15s,box-shadow .15s}
.filters input:focus,.filters select:focus{border-color:#7eafe6;box-shadow:0 0 0 3px #1769e012}
.filters input::placeholder{color:#9aa8b5}
.primary,.secondary{height:40px;border-radius:5px;font-size:11px;font-weight:750;white-space:nowrap}
.primary{border:1px solid #1467d5;background:#1467d5;color:#fff;padding:0 18px}
.primary:hover{background:#0f5ec8;border-color:#0f5ec8}
.secondary{border:1px solid #cfdae4;background:#fff;color:#385069;padding:0 15px}
.secondary:hover:not(:disabled){background:#f5f8fb;border-color:#bdcad6}

.timeline-panel{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.panel-title{min-height:76px;padding:16px 20px;border-bottom:1px solid #e7edf2;display:flex;align-items:center;justify-content:space-between;gap:18px}
.panel-title h2{font-size:15px;margin:0}
.summary{display:flex;align-items:center;gap:8px;color:#6f8193;font-size:10px;white-space:nowrap}
.summary span{background:#f2f5f8;border-radius:12px;padding:5px 9px}
.timeline{position:relative;padding:12px 20px 6px 47px;min-height:140px}
.timeline:before{content:"";position:absolute;left:28px;top:18px;bottom:14px;width:1px;background:#dfe7ef}
.event{position:relative;margin:0 0 10px;background:#fff;border:1px solid #dfe7ef;border-radius:7px;padding:15px 16px;cursor:pointer;outline:none;transition:transform .15s,border-color .15s,box-shadow .15s}
.event:last-child{margin-bottom:4px}
.event:hover,.event:focus-visible{transform:translateY(-1px);border-color:#b9cde2;box-shadow:0 5px 16px #2547650d}
.event:before{content:"";position:absolute;left:-28px;top:20px;width:9px;height:9px;border:3px solid #fff;border-radius:50%;background:#2d82df;box-shadow:0 0 0 1px #bed2e7}
.event-top,.event-bottom{display:flex;justify-content:space-between;gap:14px;align-items:center}
.event h2{font-size:13px;line-height:1.45;margin:9px 0 10px;color:#2c4257}
.event time{color:#8796a5;font-size:9px;white-space:nowrap}
.badge{display:inline-flex;align-items:center;border-radius:12px;padding:4px 8px;font-size:9px;font-weight:800;color:#2168bd;background:#e7f0fe}
.target{color:#435a70;font-size:11px;font-weight:700;overflow-wrap:anywhere}
.muted{color:#8594a3;font-size:10px;overflow-wrap:anywhere}
.timeline>.muted{padding:38px 4px;text-align:center}
.pagination{display:flex;justify-content:center;gap:8px;padding:16px 20px 20px;border-top:1px solid #edf1f4}
.pagination .secondary{height:36px}

#detail{width:min(920px,calc(100% - 28px));max-height:88vh;overflow:auto;background:#fff;border:1px solid #d8e2eb;border-radius:9px;color:var(--ink);padding:25px;box-shadow:0 22px 70px #10243d38}
#detail::backdrop{background:#10243d8c;backdrop-filter:blur(2px)}
#detail h2{margin:4px 40px 7px 0;font-size:20px;color:#263c52}
.close{position:absolute;right:13px;top:10px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:#718397;font-size:25px;line-height:1}
.close:hover{background:#f2f5f8;color:#29445e}
.detail-meta{color:#7c8d9d;padding:0 0 18px;font-size:11px;border-bottom:1px solid #e7edf2}
.diff{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.diff section,details{background:#f8fafc;border:1px solid #e1e8ef;border-radius:7px;padding:14px}
.diff h3{margin:0 0 9px;color:#52687d;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
pre{margin:0;white-space:pre-wrap;word-break:break-word;color:#3f566d;font:11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;max-height:360px;overflow:auto}
details{margin-top:12px}
summary{cursor:pointer;color:#3d5871;font-size:11px;font-weight:750}
details pre{margin-top:12px}

@media(max-width:900px){
  .filters{grid-template-columns:1fr 1fr}
  .search-field{grid-column:1/-1}
  .filters .primary{width:100%}
}
@media(max-width:800px){
  .topbar{padding:0 18px}
  .tenant-status{display:none}
  .hero-inner,.workspace{width:calc(100% - 28px)}
  .hero{min-height:226px}
  .hero-inner{padding-top:35px}
  .filter-card{margin-top:-24px}
  .panel-title{align-items:flex-start;flex-direction:column}
  .summary{width:100%;justify-content:space-between}
  .event-top,.event-bottom{align-items:flex-start;flex-direction:column;gap:6px}
  .diff{grid-template-columns:1fr}
}
@media(max-width:540px){
  .topbar{height:62px}
  .brand{font-size:14px}
  .brand-mark{transform:scale(.9)}
  h1{font-size:31px}
  .filters{grid-template-columns:1fr}
  .search-field{grid-column:auto}
  .timeline{padding-left:38px;padding-right:12px}
  .timeline:before{left:21px}
  .event:before{left:-25px}
  .summary{align-items:flex-start;flex-direction:column}
  .pagination{justify-content:stretch}
  .pagination button{flex:1}
}


/* Quick filters */
.quick-card{margin:-30px 0 18px;position:relative;z-index:2;background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:0 8px 26px #1a39530d;padding:18px 20px 20px}
.quick-card+.filter-card{margin-top:0}
.quick-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:17px}
.quick-heading h2{margin:0;font-size:15px}.quick-heading p:not(.eyebrow){margin:5px 0 0;color:#7b8b9b;font-size:10px;line-height:1.45}
.text-button{border:0;background:transparent;color:#1769e0;font-size:10px;font-weight:800;padding:6px 0}.text-button:hover{text-decoration:underline}
.quick-groups{display:grid;gap:14px}.quick-group{border-top:1px solid #edf1f4;padding-top:12px}.quick-group:first-child{border-top:0;padding-top:0}
.quick-group h3{margin:0 0 8px;color:#586d81;font-size:9px;letter-spacing:.11em;text-transform:uppercase}
.quick-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.quick-filter{min-height:58px;border:1px solid #dce5ed;background:#fbfcfd;border-radius:6px;display:flex;align-items:center;gap:10px;text-align:left;padding:9px 10px;color:#30475d;transition:.15s}
.quick-filter:hover{border-color:#b6cce2;background:#f7faff;box-shadow:0 3px 10px #2148690a}.quick-filter.active{border-color:#1769e0;background:#edf5ff;box-shadow:0 0 0 2px #1769e011}
.quick-filter .q-icon{width:28px;height:28px;display:grid;place-items:center;flex:0 0 auto;border-radius:6px;background:#e7f0fe;color:#1769e0;font-size:11px;font-weight:900}.quick-filter.active .q-icon{background:#1769e0;color:#fff}
.quick-filter span:last-child{min-width:0;display:flex;flex-direction:column;gap:2px}.quick-filter strong{font-size:10px;line-height:1.25}.quick-filter small{font-size:8px;line-height:1.25;color:#8494a3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.active-quick{margin-top:14px;border:1px solid #bcd4ef;background:#f1f7fe;border-radius:6px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center}.active-quick[hidden]{display:none}.active-quick>span{grid-row:1/3;color:#1769e0;font-size:8px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.active-quick strong{font-size:10px;color:#2f4d69}.active-quick small{font-size:8px;color:#778b9e}
.status-badge{display:inline-flex;vertical-align:middle;margin-left:6px;border-radius:10px;background:#e5f6ed;color:#27835a;font-size:8px;padding:3px 7px}
.empty-state{padding:42px 10px;text-align:center;color:#7d8d9c;display:flex;flex-direction:column;gap:5px}.empty-state strong{color:#52687d;font-size:12px}.empty-state span{font-size:10px}
@media(max-width:900px){.quick-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.quick-heading{flex-direction:column}.quick-buttons{grid-template-columns:1fr}.active-quick{grid-template-columns:1fr}.active-quick>span{grid-row:auto}.quick-filter small{white-space:normal}}

/* Collapsible quick filters */
.quick-heading{margin-bottom:0;align-items:center}
.quick-heading-copy{min-width:0}
.quick-heading-actions{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.quick-toggle{height:36px;border:1px solid #cfdae4;background:#fff;color:#385069;border-radius:5px;padding:0 11px 0 13px;display:inline-flex;align-items:center;gap:9px;font-size:10px;font-weight:800;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.quick-toggle:hover{background:#f5f8fb;border-color:#b9c9d8}
.quick-toggle:focus-visible{outline:3px solid #1769e022;outline-offset:2px;border-color:#7eafe6}
.quick-chevron{font-size:17px;line-height:1;transform:rotate(0deg);transition:transform .18s ease;color:#71869a;margin-top:-3px}
.quick-toggle.open .quick-chevron{transform:rotate(180deg);margin-top:3px}
.quick-content{margin-top:17px;padding-top:16px;border-top:1px solid #edf1f4}
.quick-content[hidden]{display:none}
.quick-heading+.active-quick{margin-top:14px}
.active-quick+.quick-content{margin-top:14px}
@media(max-width:650px){.quick-heading{align-items:flex-start;flex-direction:column}.quick-heading-actions{width:100%;justify-content:space-between}.quick-toggle{margin-left:auto}}


/* Quick filter management */
.secondary.compact{height:34px;padding:0 12px;font-size:10px}
.manager-dialog{width:min(980px,calc(100% - 28px));height:min(88vh,760px);max-height:88vh;overflow:hidden;background:#fff;border:1px solid #d8e2eb;border-radius:10px;color:var(--ink);padding:0;box-shadow:0 22px 70px #10243d38}
.manager-dialog[open]{display:flex;flex-direction:column}
.manager-dialog::backdrop{background:#10243d8c;backdrop-filter:blur(2px)}
.manager-head{position:relative;display:flex;align-items:flex-start;justify-content:space-between;flex:0 0 auto;padding:21px 24px 18px;border-bottom:1px solid #e6edf3}
.manager-head h2{margin:0;font-size:18px}.manager-head p:not(.eyebrow){margin:5px 38px 0 0;color:#7b8b9b;font-size:10px}.manager-head .close{top:11px}
.manager-layout{display:grid;grid-template-columns:310px minmax(0,1fr);flex:1 1 auto;min-height:0;overflow:hidden}
.manager-list-pane{min-height:0;background:#f8fafc;border-right:1px solid #e2e9ef;padding:16px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.manager-list-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.manager-list-actions strong{font-size:11px;color:#52687d}
.manager-list{display:grid;gap:6px}.manager-item{width:100%;border:1px solid #e0e7ed;background:#fff;border-radius:6px;padding:10px 10px 10px 11px;text-align:left;color:#334b62;display:flex;align-items:center;justify-content:space-between;gap:8px;transition:.15s}.manager-item:hover{border-color:#bfd0df;background:#fcfdff}.manager-item.active{border-color:#1769e0;background:#edf5ff;box-shadow:0 0 0 2px #1769e00d}.manager-item span:first-child{display:flex;min-width:0;flex-direction:column;gap:3px}.manager-item strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.manager-item small{font-size:8px;color:#8998a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.manager-arrow{color:#8da0b2;font-size:17px}.manager-empty{padding:24px 8px;text-align:center;color:#8293a3;font-size:10px}
.manager-form{min-height:0;padding:22px 24px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;display:grid;align-content:start;grid-template-columns:1fr 1fr;gap:14px 16px}.form-title{grid-column:1/-1;border-bottom:1px solid #edf1f4;padding-bottom:14px;margin-bottom:1px;display:flex;flex-direction:column;gap:3px}.form-title strong{font-size:13px}.form-title span{font-size:9px;color:#8494a3}
.manager-form label{display:flex;flex-direction:column;gap:5px;color:#64798d;font-size:9px;font-weight:800}.manager-form label:nth-of-type(1),.manager-form label:nth-of-type(3),.manager-form label:nth-of-type(4){grid-column:1/-1}.manager-form input{height:40px;border:1px solid #d5dfe8;border-radius:5px;background:#fff;color:#2c4257;padding:0 11px;outline:none}.manager-form input:focus{border-color:#7eafe6;box-shadow:0 0 0 3px #1769e012}.manager-form label small{font-size:8px;font-weight:500;color:#8d9aa7}.optional{font-weight:500;color:#9ba7b2}
.manager-form-actions{grid-column:1/-1;border-top:1px solid #edf1f4;padding-top:16px;margin-top:4px;display:flex;align-items:center;gap:8px}.form-spacer{flex:1}.danger-button{height:40px;border:1px solid #e1b8b2;background:#fff6f5;color:#ad473b;border-radius:5px;padding:0 14px;font-size:10px;font-weight:800}.danger-button:hover{background:#ffefed}.danger-button[hidden]{display:none}
@media(max-width:760px){.manager-dialog{height:min(92vh,780px);max-height:92vh;overflow:hidden}.manager-layout{grid-template-columns:1fr;grid-template-rows:minmax(170px,40%) minmax(0,1fr);min-height:0}.manager-list-pane{border-right:0;border-bottom:1px solid #e2e9ef;max-height:none}.manager-form{grid-template-columns:1fr}.manager-form label{grid-column:1!important}.quick-heading-actions{flex-wrap:wrap}}

html.modal-open,body.modal-open{overflow:hidden;overscroll-behavior:none}
