:root{--vs-red:#E10A0A;--vs-red-deep:#A80808;--vs-purple:#5C2D91;--ink:#1A1A1A;--ink-mid:#55555C;--ink-soft:#7A7A82;--rule:#E2E2E6;--surface:#FFFFFF;--surface-alt:#F7F7F9;--api-bg:#FDEDED;--portal-bg:#F1EBF8;--radius:4px}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}
.pagehead{padding:44px 0 28px}
.pagehead h1{margin:0 0 6px;font-size:38px;line-height:1.15;font-weight:700;letter-spacing:-.015em}
.pagehead .kicker{margin:5px 0 5px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.pagehead p{color:var(--ink-mid);font-size:16px;max-width:70ch}
.group{margin-bottom:46px}
.group-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.group-head h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.01em}
.group-head .count{font-size:13px;color:var(--ink-soft)}
.group-note{margin:0 0 18px;font-size:14px;color:var(--ink-mid)}
.group-rule{height:3px;border-radius:2px;margin-bottom:18px}
.group-rule.api{background:var(--vs-red)}
.group-rule.portal{background:var(--vs-purple)}
.group-rule.time{background:var(--ink)}
.items{display:grid;gap:14px}
.items.two{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.item{background:var(--surface);border:1px solid var(--rule);border-left:4px solid var(--rule);border-radius:var(--radius);padding:20px 22px;display:flex;flex-direction:column}
.item[data-type="api"]{border-left-color:var(--vs-red)}
.item[data-type="portal"]{border-left-color:var(--vs-purple)}
.item-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-bottom:10px}
.item h3{margin:0;font-size:19px;font-weight:700;letter-spacing:-.01em}
.tags{display:flex;gap:7px;flex-wrap:wrap}
.tag{font-size:11px;letter-spacing:.07em;text-transform:uppercase;font-weight:700;padding:4px 9px;border-radius:2px;white-space:nowrap}
.tag.api{background:var(--api-bg);color:var(--vs-red-deep)}
.tag.portal{background:var(--portal-bg);color:var(--vs-purple)}
.tag.when{background:var(--surface-alt);color:var(--ink-mid);border:1px solid var(--rule)}
.item p{margin:0 0 10px;color:var(--ink-mid);font-size:16px}
.item p b{color:var(--ink)}
.item ul{margin:0 0 10px;padding-left:0;list-style:none;color:var(--ink-mid);font-size:16px}
.item ul li{margin-bottom:3px}.item ul:not(.no) li{padding-left:22px;position:relative}.item ul:not(.no) li:before{content:"\2713";position:absolute;left:0;color:var(--vs-red);font-weight:700}
.item ul.no{list-style:none;padding-left:0}
.item ul.no li{padding-left:22px;position:relative}
.item ul.no li:before{content:"\00d7";position:absolute;left:0;color:var(--vs-red);font-weight:700}
.status{display:flex;gap:26px;flex-wrap:wrap;align-items:center;margin-top:auto;padding-top:13px;border-top:1px solid var(--rule);font-size:13px;color:var(--ink-soft)}
.status b{color:var(--ink);font-weight:700}
.cta{display:inline-block;background:var(--vs-red);color:#fff;font-size:14px;font-weight:700;letter-spacing:.01em;padding:9px 18px;border-radius:var(--radius);text-decoration:none}
.cta:hover,.cta:focus{background:var(--vs-red-deep);color:#fff;text-decoration:none}
.cta.alt{background:var(--vs-purple)}
.cta.alt:hover,.cta.alt:focus{background:#4a2475}
.empty{background:var(--surface);border:1px dashed #C9C9D0;border-radius:var(--radius);padding:26px 22px;color:var(--ink-mid);font-size:15px;margin-bottom:34px}
.empty strong{display:block;color:var(--ink);font-size:16px;margin-bottom:6px}
.empty p{margin:0}
.pagefoot{margin-top:14px;padding:10px 0 60px;font-size:13px;color:var(--ink-soft)}
.pagefoot p{margin:0}
@media (max-width:640px){.pagehead{padding:30px 0 22px}.pagehead h1{font-size:29px}.items.two{grid-template-columns:1fr}}
