.media-page{background:#f6f8fc}.media-hero{position:relative;overflow:hidden;padding:58px max(24px,calc((100vw - 1172px)/2)) 52px;color:#fff;background:linear-gradient(112deg,#211948 0%,#3b2d83 56%,#197f98 100%)}.media-hero.emoticon-hero{background:linear-gradient(112deg,#241747 0%,#5e2e82 54%,#d96875 126%)}.media-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent 76%)}.media-hero>*{position:relative;z-index:1}.media-hero-top{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}.media-hero h1{font-size:clamp(2.9rem,6vw,5.3rem);line-height:.96;letter-spacing:-.055em;margin:0 0 16px}.media-hero h1 em{font-style:normal;color:#59edf0}.emoticon-hero h1 em{color:#ffd788}.media-hero-copy{max-width:720px;color:#dedbea;font-size:1.06rem;margin:0}.media-count{min-width:128px;padding:16px 18px;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:rgba(255,255,255,.09);backdrop-filter:blur(8px)}.media-count strong,.media-count span{display:block}.media-count strong{font-size:2rem;line-height:1}.media-count span{margin-top:6px;color:#d9d6e8;font-size:.82rem}.media-switch{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}.media-switch a{padding:10px 15px;border:1px solid rgba(255,255,255,.25);border-radius:999px;color:#fff;font-weight:750}.media-switch a:hover,.media-switch a.active{background:#fff;color:#292250}.media-section{max-width:1220px;margin:0 auto;padding:54px 24px 92px}.media-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:26px}.media-section-head p{margin:0;color:#646278}.media-section-head strong{display:block;color:#5b4bdb;font-size:.76rem;text-transform:uppercase;letter-spacing:.13em;margin-bottom:5px}.media-section-head h2{font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.04em;margin:0}.media-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.media-card{min-width:0}.media-preview{position:relative;aspect-ratio:1/1;border:1px solid rgba(23,21,43,.07);border-radius:20px;overflow:hidden;background:linear-gradient(145deg,#fff,#eef2f9)}.media-preview.checker{background-color:#f7fafc;background-image:linear-gradient(45deg,#e8edf4 25%,transparent 25%),linear-gradient(-45deg,#e8edf4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e8edf4 75%),linear-gradient(-45deg,transparent 75%,#e8edf4 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.media-preview img{display:block;width:88%;height:88%;object-fit:contain;margin:6%;transition:transform .25s ease}.media-card:hover .media-preview img{transform:translateY(-4px) scale(1.025)}.media-badge{position:absolute;left:12px;top:12px;z-index:2;padding:5px 8px;border-radius:8px;background:rgba(255,255,255,.9);color:#5e5b70;font-size:.67rem;font-weight:850;letter-spacing:.04em}.media-live{position:absolute;right:12px;top:12px;z-index:2;padding:5px 8px;border-radius:999px;background:#e7fff8;color:#08775f;font-size:.67rem;font-weight:850}.media-card-body{padding:13px 3px 5px}.media-card h3{font-size:.96rem;margin:0 0 4px}.media-card p{color:#777488;font-size:.78rem;margin:0}.media-actions{display:flex;gap:8px;margin-top:12px}.media-actions a{height:40px;border-radius:10px;display:grid;place-items:center;font-size:.79rem;font-weight:800}.media-actions a:first-child{flex:1;background:#5b4bdb;color:#fff}.media-actions a:last-child{width:44px;border:1px solid #dedce8;background:#fff;color:#28243e}.media-actions a:hover{transform:translateY(-1px)}.media-note{margin:38px 0 0;padding:22px 24px;border:1px solid #e3e1ec;border-radius:18px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px}.media-note p{margin:0;color:#666378}.media-note a{color:#5545d2;font-weight:800;white-space:nowrap}.media-page .reference-footer{margin-top:0}
.comic-hero{background:linear-gradient(112deg,#12254c 0%,#166b91 58%,#18a4a9 118%)}.comic-hero h1 em{color:#ffd45f}.comic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.comic-grid .media-card:first-child{grid-column:span 2}.comic-grid .media-card:first-child .media-preview{aspect-ratio:2/1}.comic-grid .media-card:first-child .media-preview img{width:94%;height:94%;margin:3%}.media-note-links{display:flex;flex-wrap:wrap;gap:18px}
.resource-engagement{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:11px;color:#777488;font-size:.75rem}.resource-like{border:0;background:transparent;padding:0;color:#666378;font:inherit;font-weight:850;cursor:pointer;display:inline-flex;align-items:center;gap:4px}.resource-like-icon{font-size:1.5rem;line-height:1}.resource-like.liked{color:#e6466b}.resource-engagement b{font-weight:850}.media-actions{flex-wrap:wrap}.media-actions .media-workspace-link{flex:1 1 100%;width:auto;background:#17152b;color:#fff}.media-actions a[download]{flex:1;background:#5b4bdb;color:#fff}.media-actions a:last-child{flex:0 0 44px}.media-actions .media-workspace-link:hover{background:#2b2744;color:#fff}
@media(max-width:980px){.media-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.media-hero-top{align-items:flex-start}.media-count{display:none}}
@media(max-width:980px){.comic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.media-hero{padding:48px 18px 44px}.media-hero h1{font-size:3rem}.media-section{padding:44px 15px 68px}.media-section-head{align-items:flex-start;flex-direction:column}.media-grid,.comic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.comic-grid .media-card:first-child{grid-column:1/-1}.media-preview{border-radius:15px}.media-actions a:first-child{font-size:.74rem}.media-note{align-items:flex-start;flex-direction:column}}