@font-face{font-family:'OC Preview';src:url('assets/preview-regular.woff') format('woff');font-weight:400;font-display:swap}
@font-face{font-family:'OC Preview';src:url('assets/preview-bold.woff') format('woff');font-weight:700;font-display:swap}
:root{--sans:'OC Preview',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif}

/* 01: full illustration, content-sized result card. */
.share-card{max-width:390px;width:100%;border-radius:12px}
.share-stamp{padding:6px 18px;font-size:11px;line-height:18px;letter-spacing:0;justify-content:flex-start;color:#677586}
.share-image{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;margin:0}
.share-body{padding:16px 20px 12px}
.share-oc{font-size:14px;line-height:21px;margin:0 0 4px;color:#677586}
.share-body h1{font-family:var(--sans);font-size:28px;font-weight:700;line-height:40px;letter-spacing:0}
.share-body .tagline{font-size:15px;line-height:23px;margin:0 0 12px;color:#677586}
.share-tags{font-size:12px;line-height:17px;padding:4px 9px;border-radius:0;letter-spacing:0;background:#ECE8F1;color:#677586}
.share-signature{font-size:11px;line-height:17px;letter-spacing:0;margin:0 20px;padding:11px 0 10px;color:#84909A}

/* 04: illustration and identity side by side, full-width line below. */
.animal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.animal-tile{display:grid;grid-template-columns:minmax(0,61fr) minmax(0,39fr);align-items:stretch;background:#FAF8F4;border:1px solid #E2E3E5;border-radius:12px;overflow:hidden;padding:0;min-width:0}
.animal-tile img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0;align-self:center;background:transparent}
.animal-tile:hover img{transform:none}
.tile-caption{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:9px;padding:16px;background:#F0EDF4;min-width:0}
.tile-caption .tile-title{font-size:24px;line-height:1.35;font-weight:700;letter-spacing:0;overflow-wrap:anywhere}
.tile-caption .tile-kind{font-size:12px;line-height:1.5;color:#677586}
.tile-caption small{font-size:12px;line-height:1.6;letter-spacing:0;color:#677586}
.tile-description{grid-column:1/-1;font-size:15px;line-height:23px;color:#677586;padding:14px 18px 10px}
.tile-foot{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;border-top:1px solid #E2E3E5;margin:0 18px;padding:10px 0 12px;font-size:12px;line-height:1.5;color:#7C8794}
.atlas .section-heading h2{font-family:var(--sans);font-weight:700;font-size:26px;letter-spacing:0}
.dialog-copy h2{font-family:var(--sans);font-size:28px;font-weight:700;letter-spacing:0}
.dialog-copy .tagline{font-size:15px;line-height:23px;margin:8px 0 14px}
.dialog-copy>p:not(.eyebrow):not(.tagline){font-size:14px;line-height:1.8}
@media(max-width:820px){.animal-grid{grid-template-columns:1fr;gap:16px;max-width:580px;margin:0 auto}.atlas .section-heading{max-width:580px;margin-left:auto;margin-right:auto}}
@media(max-width:540px){.tile-caption{padding:12px;gap:7px}.tile-caption .tile-title{font-size:24px}.tile-description{padding:13px 16px 10px}.tile-foot{margin:0 16px}.atlas .section-heading>p{font-size:12px}.share-stamp{font-size:11px;padding:6px 18px}.share-body{padding:16px 20px 12px}.share-oc{font-size:14px}.share-body h1{font-size:28px}.share-body .tagline{font-size:15px;margin:0 0 12px}.share-tags{font-size:12px;padding:4px 9px}.share-signature{font-size:11px;padding:11px 0 10px}}
@media(max-width:360px){.tile-caption .tile-title{font-size:21px}}
@media print{.share-card{width:105mm;max-width:105mm;border:0}.share-image{width:100%;max-height:none}.share-body{padding:16px 20px 12px}.share-stamp{padding:6px 18px}.share-body h1{font-family:var(--sans);font-size:28px}.share-body .tagline{font-size:15px;line-height:23px}.share-signature{padding:11px 0 10px}}
