/* Chirp 1.0: application-only styles. Public article cards keep embed.css. */
:root{color-scheme:light;--blue:#087bbf;--ink:#0f1419;--muted:#536471;--line:#eff3f4;--pale:#f7f9f9;--surface:#fff;--hover:#e8f5fd;--field:#eff3f4;--notice:#e8f5fd;--danger:#b42335}
:root[data-theme=dark]{color-scheme:dark;--blue:#52b6f7;--ink:#f2f4f5;--muted:#a0abb4;--line:#2f3943;--pale:#192734;--surface:#15202b;--hover:#223849;--field:#253341;--notice:#20394b;--danger:#ff8b99}
body{background:var(--surface);color:var(--ink);font-size:15px;line-height:1.45}button,.pill{background:#1684d5;color:#fff}button:hover,.pill:hover{background:#0874c4}a{color:var(--blue)}.layout{max-width:1265px;grid-template-columns:260px minmax(0,600px) minmax(280px,350px)}.sidebar{padding:12px 18px;height:100vh;display:flex;flex-direction:column}.brand{font-size:34px;letter-spacing:-1.6px;padding:8px 12px;color:var(--blue)}.mark{width:35px;height:35px;font-size:30px;background:#1d9bf0;border-radius:50%;transform:none}.brand-dot{color:var(--blue)}.sidebar nav{margin:16px 0;gap:4px}.sidebar nav a{display:flex;align-items:center;gap:18px;font-size:20px;font-weight:450;border-radius:30px;padding:12px 14px;color:var(--ink);width:max-content;max-width:100%}.sidebar nav a:hover{background:var(--pale)}.sidebar nav a.selected{font-weight:750}.icon{width:25px;height:25px;flex-shrink:0}.nav-compose{text-align:center;font-size:17px;padding:14px;margin:0 6px}.theme-control{margin:18px 12px 0;font-size:12px;color:var(--muted)}.theme-control select{font-size:12px;padding:6px;margin-top:5px}.sidebar .switcher{margin-top:auto;padding:18px 8px 8px;border:0}.switcher small{font-size:11px}.switcher .identity{margin:10px 0}.switcher select{padding:7px}.sidebar-foot,.tagline{display:none}.page-header{position:sticky;top:0;z-index:5;background:var(--surface);padding:16px;min-height:62px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px}.page-header h1{font-size:20px;letter-spacing:0;margin:0;font-weight:800}.header-brand{margin-left:auto;font-weight:800;font-size:19px}.tabs{margin:0;background:var(--surface)}.tabs a{font-size:15px;padding:16px 8px}.tabs a:hover{background:var(--pale);text-decoration:none}.tabs .selected{box-shadow:inset 0 -4px #1d9bf0}.compose-bottom{margin-bottom:5px}.chirp{padding:15px 16px;border-bottom:1px solid var(--line)}.chirp:hover{background:var(--pale)}.chirp .identity{align-items:flex-start}.chirp .body{margin:7px 0 12px 56px;line-height:1.5;font-size:15px}.chirp>.reply-note,.chirp>.post-image,.chirp>.link-preview,.chirp>.actions,.chirp>.post-tools,.chirp>.embed-tools,.chirp>.media-grid,.chirp>.quote-card{margin-left:56px}.chirp>a:has(>.post-image){display:block;margin-left:56px}.chirp .post-image{width:100%;max-height:450px;object-fit:contain;background:var(--surface);border:1px solid var(--line);border-radius:16px}.chirp .actions{margin-top:13px;gap:12px;justify-content:space-between}.actions button:hover{background:var(--hover);color:var(--blue);border-radius:20px}.post-tools,.embed-tools{display:inline-block;margin-top:8px;margin-right:12px;font-size:12px}.post-tools[open],.embed-tools[open]{display:block;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px}.embed-tools textarea{min-height:90px}.repost-note{margin-left:56px;margin-bottom:9px;font-size:12px}.avatar{width:44px;height:44px}.initials{background:var(--hover);color:var(--blue)}.rightbar{padding:8px 24px}.discovery-search{display:flex;align-items:center;background:var(--field);border-radius:30px;padding:0 14px;gap:10px;color:var(--muted);position:sticky;top:8px}.discovery-search input{border:0!important;background:transparent!important;padding:13px 0!important}.discovery-search .icon{width:19px;height:19px}.right-section{background:var(--pale);border:1px solid var(--line);border-radius:16px;margin-top:18px;padding:14px 16px}.right-section h3{font-size:20px;margin:0}.suggestion{margin:20px 0}.suggestion strong{font-size:14px}.fineprint{color:var(--muted);font-size:12px;margin:18px 10px}.cover{height:auto;aspect-ratio:3;background:linear-gradient(120deg,#12679e,#67b8e9)}.cover img{display:block;width:100%;height:100%;object-fit:cover}.profile-info{padding:0 16px 16px;position:relative}.profile-info>.avatar{width:132px;height:132px;margin-top:-66px;border:4px solid var(--surface);font-size:48px}.profile-info h2{font-size:21px;margin-top:10px}.profile-info>p{margin:12px 0}.profile-info>.inline,.edit-profile{position:absolute;right:16px;top:18px}.edit-profile{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:8px 18px}.edit-profile:hover{background:var(--pale)}.profile-tabs{display:flex;overflow-x:auto;gap:0;border-bottom:1px solid var(--line)}.profile-tabs a{flex:1;white-space:nowrap;width:auto;font-size:14px}.tab-note{font-size:12px;color:var(--muted);padding:12px 16px;margin:0;border-bottom:1px solid var(--line)}.panel{padding:20px 16px}.stacked{gap:18px}.profile-card{padding:16px}.profile-card:hover{background:var(--pale);text-decoration:none}input:not([type=checkbox]),textarea,select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px}.notice{background:var(--notice)}.notice.error{background:var(--pale);color:var(--danger)}.danger{background:#b42335;color:#fff}.link-preview{background:var(--surface);color:var(--ink);border-color:var(--line)}.link-preview-text small,.link-preview-text>span{color:var(--muted)}.code{background:var(--pale)}.avatar-editor{border:1px solid var(--line);padding:16px;border-radius:12px;min-width:0;display:grid;gap:14px}.avatar-editor[hidden]{display:none}.avatar-preview{display:block;width:min(100%,300px);height:auto;border-radius:50%;margin:auto;touch-action:none;border:1px solid var(--line)}.banner-preview{display:block;width:100%;height:auto;aspect-ratio:3;touch-action:none;border:1px solid var(--line)}input[type=color]{height:44px;width:80px;padding:4px}input[type=range]{padding:0;border:0;accent-color:#1d9bf0}.current-banner{width:100%;max-width:450px;border-radius:8px}.current-avatar{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.crop-buttons{display:flex;gap:12px;flex-wrap:wrap}.remove-banner{display:flex;gap:8px;align-items:center;font-size:13px}.mobile-nav,.mobile-menu{display:none}.skip-link{position:fixed;top:-100px;left:12px;z-index:100;background:var(--surface);padding:12px}.skip-link:focus{top:8px}
@media(max-width:1100px){.layout{grid-template-columns:88px minmax(0,600px) minmax(250px,320px);max-width:1010px}.sidebar{padding:10px 8px}.brand-word,.sidebar nav a span{display:none}.sidebar nav a{padding:14px}.brand{padding:8px}.mark{margin:0}.nav-compose{font-size:12px;padding:12px 6px;margin:0}.rightbar{display:block;padding:8px 16px}.theme-control{margin:16px 0}.theme-control select{font-size:10px}.switcher .identity,.switcher>small{display:none!important}.switcher select{max-width:65px}.switcher button{font-size:11px}.sidebar .switcher{padding:10px 0}}
@media(max-width:950px){.layout{grid-template-columns:88px minmax(0,600px);max-width:688px}.rightbar{display:none}}
@media(max-width:650px){.layout{display:block;max-width:600px;padding-bottom:70px}.sidebar{display:none;position:fixed;z-index:20;top:62px;left:0;bottom:60px;width:min(310px,90vw);height:auto;max-height:none;overflow-y:auto;background:var(--surface);border-right:1px solid var(--line);box-shadow:12px 0 24px #0003;padding:16px}.sidebar.is-open{display:flex}.sidebar .brand-word,.sidebar nav a span{display:inline}.sidebar .brand{font-size:30px}.sidebar nav{display:grid;gap:3px;margin:12px 0}.sidebar nav a{font-size:18px;padding:10px 12px}.sidebar .theme-control{margin:12px}.sidebar .theme-control select{font-size:14px}.sidebar .switcher{margin-top:16px;padding:12px}.sidebar .switcher form{display:block}.sidebar .switcher select{max-width:none}.sidebar .switcher .identity{display:flex!important}.sidebar .switcher button{font-size:13px}.sidebar .nav-compose{font-size:16px}.mobile-menu{display:inline-flex!important;align-items:center;padding:4px!important}.page-header{padding:13px 16px;min-height:62px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:15;background:var(--surface);border-top:1px solid var(--line);margin:0;padding:5px 0 max(5px,env(safe-area-inset-bottom));justify-content:space-around}.mobile-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 14px;font-size:10px;color:var(--muted);border-radius:0}.mobile-nav a.selected{color:var(--blue);font-weight:750}.mobile-nav .icon{height:23px;width:23px}.chirp,.chirp .body,.chirp>.actions,.chirp>.post-tools,.chirp>.embed-tools,.chirp>a:has(>.post-image),.chirp>.link-preview,.chirp>.media-grid,.chirp>.quote-card{margin-left:0}.chirp .body{margin-top:12px}.chirp .actions{font-size:12px}.profile-info>.avatar{width:94px;height:94px;margin-top:-47px;font-size:34px}.profile-info>.inline,.edit-profile{top:12px}.profile-tabs a{font-size:12px;padding:14px 9px}.actions button{font-size:12px}.panel{padding:18px 14px}.search{gap:8px}.search button{padding:8px 14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.profile-tabs a{border-radius:0}
@media(max-width:650px){:root:not(.js) .sidebar{display:flex;position:static;width:auto;height:auto;box-shadow:none}:root:not(.js) .mobile-menu{display:none!important}}

.profile-info>.inline,.edit-profile{position:static}.profile-buttons{position:absolute;right:16px;top:18px;display:flex;gap:8px;align-items:center}.profile-buttons .pill,.profile-buttons button{font-size:13px;padding:8px 14px}@media(max-width:650px){.profile-buttons{top:12px;right:12px;gap:5px}.profile-buttons .pill,.profile-buttons button{padding:7px 10px;font-size:12px}}

.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;border-radius:14px;overflow:hidden;margin:12px 0}.media-grid a{display:block;min-width:0}.media-grid img{display:block;width:100%;height:220px;object-fit:cover}.media-count-1{grid-template-columns:1fr}.media-count-1 img{height:auto;max-height:500px;object-fit:contain}.quote-card{border:1px solid var(--line,#dce3e8);border-radius:14px;padding:14px;margin:12px 0;overflow-wrap:anywhere}.quote-card small{display:inline}.quote-card p{margin:10px 0}.quote-card .media-grid img{height:150px}@media(max-width:650px){.media-grid img{height:160px}}

.attachment-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.attachment-preview{border:1px solid var(--line);border-radius:12px;padding:10px;min-width:0}.attachment-preview img{width:100%;height:140px;object-fit:contain}.attachment-preview label{font-size:12px}.composer .attachment-preview textarea{font-size:13px;min-height:60px;border:1px solid var(--line);padding:8px;margin:5px 0}.attachment-preview button{font-size:12px}@media(max-width:420px){.attachment-previews{grid-template-columns:1fr}}

/* Notifications */
.nav-badge{display:inline-block;min-width:18px;padding:0 5px;margin-left:6px;border-radius:999px;background:#1684d5;color:#fff;font-size:11px;line-height:18px;text-align:center;font-weight:700}
.sidebar nav a{position:relative}.sidebar nav a .nav-badge-icon{position:absolute;top:5px;left:33px;margin:0}
@media(max-width:1100px){.sidebar nav a .nav-badge{display:inline-block;position:absolute;top:4px;left:50%;margin:0}.sidebar nav a{position:relative}}
.notification{position:relative;display:flex;gap:12px;align-items:flex-start;padding:14px 16px 14px 22px;border-bottom:1px solid var(--line)}
.notification.unread{background:var(--notice)}
.notification .unread-dot{position:absolute;left:8px;top:20px;width:7px;height:7px;border-radius:50%;background:#1684d5}
.notification-text{min-width:0;flex:1}
.notification-text p{margin:0}
.notification-text .name{font-weight:700}
.notification-excerpt{display:block;margin:3px 0;color:var(--muted);overflow-wrap:anywhere}
.notification-excerpt.muted{font-style:italic}
.notification time{display:block;font-size:13px;color:var(--muted)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Verification badge (in-character decoration, player-controlled) */
.verified{display:inline-block;width:1em;height:1em;margin-left:.25em;vertical-align:-.12em;fill:#1684d5;stroke:none;flex:none}
.verified .verified-tick{fill:none;stroke:var(--surface);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
h2 .verified,.profile-info h2 .verified{width:.8em;height:.8em}
label.checkbox{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:600}
label.checkbox input{width:auto;margin:0}
label.checkbox small{flex-basis:100%;font-weight:400;color:var(--muted)}

/* Many profiles per player: switcher overflow, search and paging */
.switcher-all{display:block;margin-top:6px;font-size:13px}
.profile-filter{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}
.profile-filter input{flex:1;min-width:160px}
.profile-row-actions{display:flex;gap:10px;align-items:center}
.profile-row-actions form{margin:0}
.profile-row-actions .in-use{color:var(--muted)}
.profile-paging{display:flex;gap:16px;justify-content:space-between;margin-top:12px}

/* Upgrade activation panel */
.upgrade-steps{list-style:none;padding:0;margin:12px 0}
.upgrade-steps li{padding:6px 0 6px 24px;position:relative;border-bottom:1px solid var(--line)}
.upgrade-steps li:last-child{border-bottom:0}
.upgrade-steps li::before{position:absolute;left:0;top:6px;font-weight:700}
.upgrade-steps .state-complete::before{content:"\2713";color:#0a7d3f}
.upgrade-steps .state-pending::before{content:"\25CB";color:var(--muted)}
.upgrade-steps .state-unfinished::before{content:"\26A0";color:#b4610a}

/* Composer: collapsed to a single line until it is being used. */
.composer{padding:10px 16px;border-bottom:8px solid var(--pale)}
.composer-row{display:flex;gap:12px;align-items:flex-start}
.composer-who{flex:none;padding-top:2px}
.composer-who .avatar{width:44px;height:44px}
.composer-field{flex:1;min-width:0}
.composer textarea{font-size:19px;line-height:1.35;min-height:34px;height:34px;padding:6px 0;border:0;background:transparent;resize:none;overflow:hidden;width:100%}
.composer textarea:focus{outline:none}
.composer-field:focus-within textarea,.composer.is-open textarea{min-height:76px}
/* Which persona is speaking: hidden until the composer is in use, never a surprise. */
.composer-as{margin:0;font-size:13px;color:var(--muted);display:none}
.composer-field:focus-within .composer-as,.composer.is-open .composer-as{display:block}
.composer-as span{opacity:.8}
.compose-bottom{display:flex;align-items:center;gap:12px;margin:6px 0 0;padding-top:6px;border-top:1px solid var(--line)}
.composer .attachment{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;cursor:pointer;color:#1684d5;margin:0}
.composer .attachment:hover{background:var(--hover)}
.composer .attachment:focus-within{outline:2px solid #1684d5;outline-offset:2px}
.composer .attachment input[type=file]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.composer .attachment .icon{width:22px;height:22px}
.composer-count{margin-left:auto;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.composer-count.is-close{color:#b4610a}
.composer-count.is-over{color:#c3321f;font-weight:700}
.composer .compose-bottom button{margin-left:0;padding:8px 20px;font-weight:700}
.composer .compose-bottom button[disabled]{opacity:.45;cursor:default}
.composer-count:not([hidden])+button{margin-left:12px}
.composer-count[hidden]+button{margin-left:auto}
.composer-reply{border-bottom:1px solid var(--line)}
.composer-reply textarea{font-size:17px}
@media(max-width:700px){
 .composer{padding:8px 12px}
 .composer-who .avatar{width:38px;height:38px}
 .composer textarea{font-size:17px}
}

/* Administrator: change a player's sign-in address */
.admin-email{margin:6px 0 0 0;font-size:13px}
.admin-email summary{cursor:pointer;color:var(--muted);padding:4px 0}
.admin-email summary:hover{color:var(--blue)}
.admin-email form{padding:10px 0 4px;border:0}
.admin-email .muted{font-size:12px}

/* Post actions: a quiet row of icons, colour only on hover or when the action is on. */
/* Four equal cells, each left-aligned, so the gaps are the same whatever the counts are.
   .chirp .actions is needed to outrank the older space-between rule above. */
.chirp .actions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));justify-content:start;align-items:center;gap:0;max-width:460px;margin-top:8px;position:relative;left:calc(var(--act-pad,8px) * -1)}
.chirp .actions>*{justify-self:start}
.actions .inline{display:block;margin:0}
.actions .act{display:inline-flex;align-items:center;gap:6px;height:34px;box-sizing:border-box;padding:0 var(--act-pad,8px);font-weight:400;white-space:nowrap;border:0;background:none;color:var(--muted);font-size:13px;line-height:1;border-radius:999px;cursor:pointer;text-decoration:none;transition:color .12s,background .12s}
.actions .act .icon{width:18px;height:18px}
.actions .act-count{min-width:1ch;font-variant-numeric:tabular-nums;white-space:nowrap}
.actions .act:hover,.actions .act:focus-visible{background:var(--hover)}
.actions .act-reply:hover,.actions .act-reply:focus-visible{color:#1684d5}
.actions .act-quote:hover,.actions .act-quote:focus-visible{color:#1684d5}
.actions .act-rechirp:hover,.actions .act-rechirp:focus-visible{color:#0a7d3f}
.actions .act-like:hover,.actions .act-like:focus-visible{color:#c3321f}
.actions .act-rechirp.is-on{color:#0a7d3f}
.actions .act-like.is-on{color:#c3321f}
.actions .act-like.is-on .icon{fill:#c3321f}
.actions .act-static{cursor:default}
.actions .act-static:hover{background:none}
.post-tools>summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;height:34px;width:34px;box-sizing:border-box;padding:0;border-radius:999px;color:var(--muted);cursor:pointer}
.post-tools>summary::-webkit-details-marker{display:none}
.post-tools>summary:hover{background:var(--hover);color:var(--blue)}
.post-tools>summary .icon{width:18px;height:18px}
/* More takes the fifth cell of the same grid, so it sits on the same line with the same gaps.
   The -8px pulls the first icon's edge level with the text above (the buttons carry 8px padding). */
.chirp>.post-tools:not([open]){margin-top:-34px;margin-right:0;max-width:460px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative;left:calc(var(--act-pad,8px) * -1)}
/* The closed More box is as wide as the row it sits on and is positioned, so it stacks above the
   icons beneath it and swallows their clicks. It must let every click through except on its own button. */
.chirp>.post-tools:not([open]){pointer-events:none}
.chirp>.post-tools:not([open])>summary{grid-column:5;justify-self:start;pointer-events:auto}
.chirp>.post-tools[open]{margin-top:8px;max-width:none;display:block}

/* Narrow phones: tighter buttons so a three-digit count never wraps or reaches the next icon. */
@media(max-width:420px){
 .chirp{--act-pad:5px}
 .actions .act{gap:4px}
}

/* Embed section of the More menu: one instruction, one button, the raw code tucked away. */
.embed-menu{padding-bottom:12px;margin-bottom:2px;border-bottom:1px solid var(--line)}
.embed-menu h4{margin:0 0 4px;font-size:14px}
.embed-menu p{margin:0 0 8px;color:var(--muted);font-size:13px}
.embed-menu .copy-row{display:flex;gap:8px;align-items:center;margin-top:8px}
.embed-menu .copy-row input{flex:1;min-width:0;font-size:13px;padding:7px 10px}
.embed-menu .copy-row button{flex:none;padding:7px 14px;font-weight:600}
.embed-menu .copy-status{display:block;min-height:1.2em;margin-top:4px;color:var(--muted)}
.embed-menu .embed-code{margin-top:6px;font-size:13px}
.embed-menu .embed-code summary{cursor:pointer;color:var(--muted);padding:4px 0}
.embed-menu .embed-code summary:hover{color:var(--blue)}
.embed-menu textarea{width:100%;font:12px/1.5 ui-monospace,monospace;min-height:90px;margin:6px 0 0;overflow-wrap:anywhere}
/* Picture viewer (lightbox.js). Dark whatever the page theme is, as a picture is easiest to see on dark. */
.has-lightbox .media-grid a{cursor:zoom-in}
html.lightbox-open{overflow:hidden}
dialog.lightbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(5,9,14,.95);color:#fff;overscroll-behavior:contain}
dialog.lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr);animation:lightbox-in .14s ease-out}
dialog.lightbox::backdrop{background:#000}
@keyframes lightbox-in{from{opacity:0}to{opacity:1}}
.lightbox-bar{display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top))}
.lightbox-count{margin-right:auto;min-width:0;font-size:15px;font-weight:650}
.lightbox-original{color:#fff;font-size:14px;line-height:44px;padding:0 14px;border-radius:999px;text-decoration:underline;text-underline-offset:3px}
.lightbox-original:hover{background:rgba(255,255,255,.16)}
.lightbox button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff}
.lightbox button:hover{background:rgba(255,255,255,.3);color:#fff}
.lightbox button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.lightbox button:focus-visible,.lightbox-original:focus-visible{outline:3px solid #fff;outline-offset:3px}
.lightbox-figure{margin:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;align-items:center;padding:0 12px}
.lightbox-image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;min-height:0;object-fit:contain;border-radius:6px;transition:opacity .15s}
.lightbox-image.is-loading{opacity:.35}
.lightbox-caption{max-width:70ch;max-height:22vh;overflow:auto;padding:12px 8px calc(14px + env(safe-area-inset-bottom));font-size:15px;line-height:1.45;text-align:center}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;margin-top:-22px}
.lightbox-prev{left:max(10px,env(safe-area-inset-left))}
.lightbox-next{right:max(10px,env(safe-area-inset-right))}
@media(prefers-reduced-motion:reduce){dialog.lightbox[open]{animation:none}.lightbox-image{transition:none}}
/* Three pictures: one large on the left, two stacked on the right, so no cell is left empty. */
.media-count-3{grid-template-rows:220px 220px}
.media-count-3 a:first-child{grid-row:1/span 2}
.media-count-3 img{height:100%}
.quote-card .media-count-3{grid-template-rows:150px 150px}
.quote-card .media-count-3 img{height:100%}
@media(max-width:650px){.media-count-3{grid-template-rows:160px 160px}}