/* A narrower reading column with compact, aligned case rows. */
.brand .mark{width:42px;height:42px;flex:0 0 42px;background:none;border-radius:13px;box-shadow:0 3px 9px #102a421a}
.brand .mark img{display:block;width:100%;height:100%}
header,main{max-width:1200px;padding-left:32px;padding-right:32px}
.workspace{grid-template-columns:minmax(0,1fr) 232px;gap:22px}
.intro{padding:26px 0 24px}
.platform-bar{padding:13px 16px;margin-bottom:18px;border-radius:10px}
.case{grid-template-columns:18px minmax(0,1fr) 140px 78px;gap:12px;padding:17px 16px}
.case h3{line-height:1.6;margin-bottom:5px}
.row-metric strong{font-size:20px;letter-spacing:-.4px}
.row-metric small{display:none}
.read{font-size:14px}
dialog{max-width:740px}
@media(max-width:1050px){header,main{padding-left:26px;padding-right:26px}.workspace{grid-template-columns:minmax(0,1fr) 210px;gap:18px}.case{grid-template-columns:16px minmax(0,1fr) 120px 76px;gap:10px}}
@media(max-width:900px){.workspace{display:block}}
@media(max-width:600px){
 header{padding:0 18px}main{padding:0 16px}
 .intro{padding:20px 0}.intro p{max-width:32em}
 .platform-bar{margin-left:-16px;margin-right:-16px;border-radius:0;padding:11px 16px}
 .categories{margin:12px 0 16px}.categories button{font-size:14px;padding:6px 8px}
 .case{grid-template-columns:16px minmax(0,1fr) 80px;padding:15px 12px;gap:6px 9px}
 .case h3{font-size:16px;line-height:1.6;margin-bottom:5px}
 .row-copy{grid-column:2/4}.row-metric{grid-column:2;grid-row:2;margin-top:3px}
 .row-metric strong{font-size:21px}.read{grid-column:3;grid-row:2;margin-top:3px;min-height:42px}
 dialog{width:calc(100% - 24px)}#detail-body{padding:18px}
}

/* Official brand assets keep their original colors, including in the selected tab. */
.platform-bar .platform-icon{display:grid;place-items:center;flex:0 0 26px;width:26px;height:26px;padding:2px;border:0;border-radius:6px;background:#fff;overflow:hidden}
.platform-bar nav button.active .platform-icon{background:#fff;border-color:transparent}
.platform-icon img{display:block;width:22px;height:22px;object-fit:contain}
.platform-bar nav button{gap:7px;min-height:44px;padding:7px 11px}

.community-proof{margin:20px -20px -20px;padding:20px;border-top:1px solid var(--line);text-align:left;background:#fbfcfe;border-radius:0 0 12px 12px}
.community-proof h3{font-size:15px;margin:0 0 10px;line-height:1.6;color:#27384c}
.community-proof dl{margin:0}.community-proof dl>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 0}.community-proof dl>div+div{border-top:1px solid #e9edf2}.community-proof dt{font-size:13px;color:#617087}.community-proof dd{margin:0;color:#d35213;font-size:15px;font-weight:750;white-space:nowrap}.invite-aside .community-proof-note{font-size:11px;line-height:1.8;color:#8590a0;margin:12px 0 0}
@media(max-width:1150px){.community-proof{margin-left:-16px;margin-right:-16px;margin-bottom:-16px;padding:16px}}
@media(min-width:901px) and (max-height:1050px){.invite-aside{position:static}}

/* Shared conversion card stays in normal flow after the rendered content. */
.tail-invite{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 1.25fr);gap:24px;align-items:center;margin:16px 0 0;padding:24px;border:1px solid #b8e5db;border-radius:16px;background:#f0faf7;overflow:hidden;text-align:left}
.tail-brand{max-width:260px;justify-self:center;align-self:center}
.tail-brand img{display:block;width:100%;height:auto;border-radius:12px}
.tail-action{min-width:0}.tail-kicker{font-size:13px;font-weight:650;letter-spacing:.04em;color:#087967}
.tail-action h3{font-size:23px;line-height:1.45;color:#073f37;margin:8px 0 12px}
.tail-action p{font-size:15px;line-height:1.8;color:#42675f;margin:0 0 10px}
.tail-action .tail-benefits{font-size:16px;font-weight:600;color:#174f43;line-height:1.9}
.free-emphasis{display:inline-block;margin-right:4px;padding:0 7px;border-radius:6px;background:#ffead6;color:#a53c00;font-size:23px;font-weight:800;line-height:1.5;vertical-align:baseline}
.tail-qr{display:block;width:100%;max-width:325px;margin:14px 0 12px;border-radius:10px;overflow:hidden;background:#fff}
.tail-qr img{display:block;width:100%;height:auto}
.tail-button{display:flex;align-items:center;justify-content:center;gap:12px;max-width:325px;min-height:46px;padding:11px 14px;border-radius:9px;background:#087968;color:white;text-decoration:none;font-size:15px;font-weight:700;line-height:1.5;transition:background .18s}
.tail-button:hover{background:#055e51}.tail-button:focus-visible,.tail-qr:focus-visible{outline:3px solid #ee8a24;outline-offset:4px}
.tail-action .tail-help{font-size:12px;line-height:1.8;margin:10px 0 4px;color:#59776f}.tail-action small{display:block;font-size:12px;line-height:1.7;color:#687c77}
#detail-body>.tail-invite{margin-top:20px}
@media(max-width:600px){.tail-invite{grid-template-columns:minmax(0,1fr);gap:20px;padding:20px 16px;margin-top:12px}.tail-brand{width:100%;max-width:240px}.tail-action h3{font-size:22px}.tail-qr,.tail-button{max-width:100%}.tail-action .tail-help{font-size:13px}#detail-body>.tail-invite{margin-left:0;margin-right:0}}

.pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:20px 12px;background:#fff;border:1px solid #e1e7ef;border-radius:12px;margin-top:16px;color:#53647b;font-size:14px}
.page-summary{font-variant-numeric:tabular-nums}.page-size{display:flex;align-items:center;gap:8px;white-space:nowrap}.page-size select{font:inherit;background:#fff;color:#26384d;border:1px solid #dce3ec;border-radius:8px;padding:9px;min-height:44px}.page-links{display:flex;justify-content:center;align-items:center;gap:5px;flex-wrap:wrap;width:100%}.page-links button{font:inherit;min-width:38px;min-height:44px;padding:7px 10px;border:1px solid #dce3ec;border-radius:8px;background:#fff;color:#53647b;cursor:pointer}.page-links button[aria-current=page]{background:#f15a18;border-color:#f15a18;color:#fff;font-weight:700}.page-links button:hover:not(:disabled):not([aria-current]){background:#fff3eb;border-color:#f15a18}.page-links button:disabled{opacity:.4;cursor:default}.page-links button:focus-visible,.page-size select:focus-visible{outline:3px solid #273e5a;outline-offset:2px}.page-gap{padding:0 3px}#result-title{scroll-margin-top:20px}
@media(max-width:400px){.pagination{padding:14px 8px;gap:10px}.page-links{gap:3px}.page-links button{min-width:32px;padding:6px 7px}.page-gap{padding:0}.page-summary{font-size:13px}}
