/* o2c-real-lesson-examples */
/* Original lesson slides, contained without cropping. */
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:12px;align-items:start;align-content:start;min-height:0;max-height:none;height:auto;aspect-ratio:auto;padding:12px;width:min(100%,calc(320px * var(--mag-image-ratio,1.333333) + 26px));max-width:100%;border:1px solid #dce7dd;border-radius:10px;background:#fff}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media.o2c-legacy-media--pair{grid-template-columns:repeat(2,minmax(0,1fr))}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media .o2c-lesson-teaser{display:block;min-width:0;margin:0;padding:0;border:0;background:transparent}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media .o2c-lesson-teaser>img{display:block;width:100%;max-width:100%;height:auto;max-height:none;object-fit:contain;object-position:center;margin:0;padding:0;border:0;border-radius:0;transform:none}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media .o2c-lesson-teaser>figcaption{margin:8px 0 0;color:#596e61;font:500 11px/1.45 'O2C Inter',Inter,Arial,sans-serif;text-align:left}
#o2c-announcements .o2c-legacy-gallery.o2c-lesson-gallery .o2c-gallery-preview{padding:12px;border:1px solid #d9e5df;border-radius:10px;background:#fff}
#o2c-announcements .o2c-legacy-gallery.o2c-lesson-gallery .o2c-gallery-preview img{height:auto;max-height:none;object-fit:contain;border-radius:0}
@media(max-width:640px){#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry .o2c-entry-preview .o2c-entry-media.o2c-legacy-media.o2c-lesson-media.o2c-legacy-media--pair{grid-template-columns:minmax(0,1fr)}#o2c-announcements .o2c-legacy-gallery.o2c-lesson-gallery .o2c-gallery-grid{grid-template-columns:minmax(0,1fr)}}


/* o2c-lesson-layout-polish */

/* Give paired lesson examples room without changing the feature animations. */
@container magazine (min-width:901px){
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) .o2c-entry-preview{grid-template-columns:minmax(0,2fr) minmax(0,3fr);grid-template-rows:auto auto auto auto auto minmax(0,1fr);column-gap:30px;min-height:0}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) :is(.o2c-badges,.o2c-entry-title,.o2c-excerpt,.o2c-match,.o2c-magazine-action){grid-column:1}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) .o2c-badges{grid-row:1;align-self:start}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) .o2c-date{grid-column:1;grid-row:2;justify-self:start;align-self:start;margin:8px 0 0}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) h4.o2c-entry-title{margin-top:18px;font-size:clamp(28px,2.8vw,34px)}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"] .o2c-entry-preview .o2c-entry-media.o2c-lesson-media{grid-column:2;grid-row:1/7;width:100%;align-self:center}
}
/* Keep the examples close to their description; put the article action last. */
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="lead"]:has(.o2c-lesson-media) .o2c-entry-preview{grid-template-rows:auto auto auto auto auto auto auto minmax(0,1fr) auto;align-content:start}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="lead"] .o2c-entry-preview .o2c-entry-media.o2c-lesson-media{grid-row:7;align-self:start;margin-top:22px}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="lead"]:has(.o2c-lesson-media) .o2c-magazine-action{grid-row:9;margin-top:16px}
@container magazine (max-width:900px) and (min-width:701px){
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) .o2c-entry-preview{grid-template-columns:minmax(0,1fr) 124px;grid-template-rows:repeat(8,auto);min-height:0}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"] .o2c-entry-preview .o2c-entry-media.o2c-lesson-media{grid-column:1/3;grid-row:7;width:100%;margin-top:22px}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-archive-entry[data-magazine-size="wide"]:has(.o2c-lesson-media) .o2c-magazine-action{grid-row:8;justify-content:flex-end}
}


/* o2c-roundup-contents-styles */

/* Approved complete roundup contents, scoped to the List view. */
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup{background:#f6f7f5!important;border-color:#dce2dd!important;border-radius:6px!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup::before{display:none!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup:is(:hover,:focus-within){background:#f1f4f0!important;border-color:#a8b7ab!important;box-shadow:0 7px 22px -18px #213d3240!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-preview.o2c-roundup-preview{display:grid!important;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;grid-template-rows:auto auto!important;gap:18px 40px!important;padding:28px 32px 24px!important;min-height:0!important;position:relative!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-meta{grid-column:1/-1!important;grid-row:1!important;display:flex!important;align-items:baseline!important;justify-content:space-between!important;gap:12px 24px!important;min-width:0!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-date{position:static!important;grid-area:auto!important;width:auto!important;display:block!important;margin:0!important;color:#6d7b70!important;font-size:12px!important;line-height:1.5!important;flex-shrink:0!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-summary{display:block!important;grid-column:1!important;grid-row:2!important;min-width:0!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-badges{display:flex!important;flex-wrap:wrap!important;align-items:baseline!important;margin:0!important;gap:4px 10px!important;min-width:0!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-type{position:static!important;display:inline-flex!important;flex-shrink:0!important;gap:7px!important;font-size:10px!important;line-height:18px!important;letter-spacing:.09em!important;text-transform:uppercase!important;color:#657269!important;margin:0!important;font-weight:650!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-category{position:static!important;grid-area:auto!important;display:inline!important;flex:0 1 auto!important;max-width:100%!important;margin:0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;color:#7b877b!important;font-size:10px!important;line-height:1.5!important;font-weight:400!important;letter-spacing:normal!important;white-space:normal!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-category::before{content:"·"!important;display:inline!important;width:auto!important;height:auto!important;background:none!important;border:0!important;margin:0 8px 0 0!important;position:static!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-title{font-size:25px!important;line-height:1.28!important;letter-spacing:-.035em!important;margin:0!important;color:#2b4336!important;max-width:38ch!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup :is(.o2c-excerpt,.o2c-match){font-size:14px!important;line-height:1.65!important;color:#637368!important;margin:13px 0 0!important;max-width:65ch!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-contents{grid-column:2!important;grid-row:2!important;padding:0!important;min-width:0!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-kicker{font-size:9px!important;line-height:1.4!important;letter-spacing:.11em!important;text-transform:uppercase!important;color:#7a867c!important;margin:0 0 9px!important;font-weight:650!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-items{list-style:none!important;margin:0!important;padding:0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0 26px!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-items li{display:grid!important;grid-template-columns:18px minmax(0,1fr)!important;align-items:baseline!important;gap:9px!important;padding:11px 0!important;margin:0!important;border-top:1px solid #dbe2dc!important;font-size:13px!important;line-height:1.5!important;font-weight:550!important;color:#3e5346!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-items li::before{display:none!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-number{font-size:10px!important;color:#8a968b!important;font-weight:500!important;letter-spacing:.03em!important;font-variant-numeric:tabular-nums!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-action{display:inline-flex!important;align-items:center!important;gap:13px!important;margin:12px 0 0!important;min-height:32px!important;font-size:12px!important;line-height:1.5!important;font-weight:600!important;color:#4f6757!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-action>span{transition:transform .18s ease!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup:is(:hover,:focus-within) .o2c-roundup-action>span{transform:translateX(3px)!important}
#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup :is(.o2c-editorial-roundup-count,.o2c-magazine-action){display:none!important}
@media(max-width:1000px){
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-preview.o2c-roundup-preview{grid-template-columns:minmax(0,1fr)!important;gap:18px!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-title{max-width:52ch!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-contents{grid-column:1!important;grid-row:3!important}
}
@media(max-width:760px){
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-preview.o2c-roundup-preview{padding:24px!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-date{font-size:11px!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-title{font-size:23px!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-kicker{display:none!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-meta{gap:10px!important}
}
@media(max-width:600px){
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-items{grid-template-columns:minmax(0,1fr)!important;gap:0!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-items li{font-size:13px!important;padding:10px 0!important}
 #o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-category::before{display:none!important}
}
@media(max-width:380px){#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-entry-preview.o2c-roundup-preview{padding:20px!important}#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-date{font-size:10px!important}#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-type{font-size:9px!important}}
@media(prefers-reduced-motion:reduce){#o2c-announcements:not(.is-reader):not(.is-calendar) #o2c-feed.o2c-editorial-feed .o2c-editorial-roundup .o2c-roundup-action>span{transition:none!important;transform:none!important}}

/* Browse & read retains its compact navigation cards and original date order. */
#o2c-announcements.is-reader #o2c-feed :is(.o2c-roundup-contents,.o2c-roundup-action){display:none}
#o2c-announcements.is-reader #o2c-feed .o2c-roundup-meta{display:flex;flex-direction:column}
#o2c-announcements.is-reader #o2c-feed .o2c-roundup-meta .o2c-date{order:-1}



/* o2c-feed-gallery-polish */

/* Screenshot links remain separate from each card's announcement link. */
#o2c-announcements #o2c-feed .o2c-feed-image-target{position:relative}
#o2c-announcements #o2c-feed .o2c-feed-image-link{position:absolute;inset:0;z-index:3;display:block;width:auto;height:auto;min-width:0;margin:0;padding:0;border:0;border-radius:8px;background:transparent;color:#255e58;text-decoration:none;box-shadow:none;cursor:zoom-in}
#o2c-announcements #o2c-feed .o2c-feed-image-link:focus-visible{outline:3px solid #297d77;outline-offset:3px}
#o2c-announcements #o2c-feed .o2c-feed-image-cue{position:absolute;top:7px;right:7px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid rgb(41 125 119 / 18%);border-radius:50%;background:rgb(255 255 255 / 94%);box-shadow:0 2px 5px rgb(29 65 54 / 8%);opacity:.7;transition:opacity 150ms ease,background-color 150ms ease}
#o2c-announcements #o2c-feed .o2c-feed-image-link:is(:hover,:focus-visible) .o2c-feed-image-cue{opacity:1;background:#fff}
#o2c-announcements #o2c-feed .o2c-feed-image-cue svg{display:block;width:17px;height:17px}
#o2c-announcements .o2c-gallery-dialog.is-feed-gallery[open]{animation:none;transform:none}
#o2c-announcements .o2c-gallery-dialog[data-feed-entrance] .o2c-gallery-image{animation:none!important}
#o2c-announcements .o2c-gallery-flying-image{position:fixed;z-index:20;display:block;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;object-fit:contain;pointer-events:none;box-shadow:none;transform:none}
@media(hover:none){#o2c-announcements #o2c-feed .o2c-feed-image-cue{opacity:1}}
@media(prefers-reduced-motion:reduce){#o2c-announcements #o2c-feed .o2c-feed-image-cue{transition:none}}
@media print{#o2c-announcements #o2c-feed .o2c-feed-image-link{display:none!important}}


/* Keep the magnifier beside the caption, clear of lesson instructions. */
#o2c-announcements #o2c-feed .o2c-lesson-teaser .o2c-feed-image-cue{top:auto;bottom:-4px;right:0;width:25px;height:25px}
#o2c-announcements #o2c-feed .o2c-lesson-teaser>figcaption{padding-right:33px}

