/* Approved site-wide visual refinements. September 2026. */
/* A shared selected treatment, used across the site. */
.o2c-shared-nav .o2c-nav-local a:is([aria-current="page"],[aria-current="location"]) {background:#1c4e45!important;color:#fff!important;border-color:#1c4e45!important;box-shadow:none!important;}

/* Approved refinement: make current location and useful secondary information easier to read. */
#o2c-announcements[data-page="hub"] .o2c-hero { display:block; padding-bottom:30px; }
#o2c-announcements[data-page="hub"] .o2c-hero > p { margin:14px 0 0; max-width:64ch; font-size:16px; line-height:1.6; text-align:left; color:#48625b; }
#o2c-announcements[data-page="hub"] .o2c-reader-switch button[aria-pressed="true"] { background:#1c4e45!important; color:#fff!important; border-color:#1c4e45!important; box-shadow:none!important; }
#o2c-announcements[data-page="hub"] .o2c-reader-switch button { min-height:44px; padding-inline:16px; }
#o2c-announcements[data-page="hub"] .o2c-entry-type, #o2c-announcements[data-page="hub"] .concept-badge { font-size:11px!important; line-height:1.5!important; }
#o2c-announcements[data-page="hub"] .o2c-date, #o2c-announcements[data-page="hub"] .o2c-entry-category, #o2c-announcements[data-page="hub"] .concept-category { font-size:12px!important; line-height:1.5!important; }
#o2c-announcements[data-page="hub"] #o2c-results, #o2c-announcements[data-page="hub"] .o2c-section-heading > a { font-size:13px; }
#o2c-announcements[data-page="hub"] #o2c-filter-trigger { box-shadow:none; border-color:#8caaa1; }
#o2c-announcements[data-page="hub"] #o2c-mini-calendar { border:1px solid #ccdcd4!important; background:#fff!important; }
#o2c-announcements[data-page="hub"] .o2c-month-heading { color:#264e43!important; }
@media(max-width:700px){
 #o2c-announcements[data-page="hub"] .o2c-hero {padding-bottom:22px;}
 #o2c-announcements[data-page="hub"] .o2c-hero > p{font-size:15px; margin-top:10px;}
 #o2c-announcements[data-page="hub"] .o2c-reader-switch button{padding-inline:11px;}
}
#o2c-announcements[data-page="hub"] .o2c-hero > p { justify-self:start; white-space:normal; }

/* Approved announcement image and resource styling. */
/* Let real lesson screenshots provide the frame, with a readable caption below. */
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-link {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  overflow: visible;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-preview {
  padding: 0;
  border: 1px solid #d8e1da;
  border-radius: 5px;
  background: #fff;
  overflow: hidden;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-hint {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  min-height: 34px;
  padding: 5px 0 0;
  font: 600 12px/1.4 'O2C Inter', Inter, Arial, sans-serif;
  color: #297d77;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-hint::before {
  content: '';
  display: block;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5M10.5 7v7M7 10.5h7'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-item figcaption {
  margin-top: 5px;
  color: #3e6057;
  font-size: 14px;
  line-height: 1.55;
  text-align: left;
  text-wrap: balance;
  overflow-wrap: normal;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-legacy-gallery .o2c-gallery-link:is(:hover,:focus-visible) .o2c-gallery-preview {
  border-color: #297d77;
}
/* Give the practical next step and adjacent updates clearer visual roles. */
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  column-gap: 28px;
  align-items: center;
  padding: 24px 28px;
  border-radius: 7px;
  background: #f0f6f2;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box > .o2c-eyebrow {
  grid-column: 1;
  align-self: end;
  margin-bottom: 5px;
  color: #63766b;
  font-size: 10px;
  letter-spacing: .06em;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box > h2 {
  grid-column: 1;
  align-self: start;
  margin: 0;
  font-size: 23px;
  line-height: 1.2;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box > .o2c-resource-list {
  grid-column: 2;
  grid-row: 1 / 3;
  margin: 0;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box .o2c-resource-list a {
  font-size: 15px;
  font-weight: 600;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-neighbors {
  gap: 18px;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-neighbors a {
  position: relative;
  justify-content: center;
  gap: 7px;
  padding: 18px 46px 18px 20px;
  border: 1px solid #dce6df;
  border-radius: 7px;
  background: #fff;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-neighbors a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 18px;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background: #297d77;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-6-6 6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-neighbors a:is(:hover,:focus-visible) {
  background: #f0f6f2;
  border-color: #297d77;
}
#o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-neighbors span {
  font-size: 11px;
  color: #63766b;
}
@media(max-width: 600px) {
  #o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box {
    display: block;
    padding: 22px;
  }
  #o2c-announcements[data-page="detail"] .o2c-detail:not(.o2c-launch-page) .o2c-help-box > .o2c-resource-list {
    margin-top: 18px;
  }
}

/* Visual refinement. Preserve Roadmap groups, copy, order, controls and Preview. */
#roadmap .status-label{font-size:12px;line-height:1.35}
#roadmap .timing,#roadmap .source-date{font-size:12px;line-height:1.5}
#roadmap .notice{font-size:12px;line-height:1.55}
@media(max-width:540px){
 #roadmap .notice{margin-top:11px}
 #roadmap .ongoing-grid .roadmap-card>summary{display:flex;flex-direction:column}
 #roadmap .ongoing-grid .card-copy{display:contents}
 #roadmap .ongoing-grid .card-meta{order:0;justify-content:flex-start;gap:10px 14px;margin:23px 24px 18px}
 #roadmap .ongoing-grid .card-title{order:1;margin:0 24px 12px}
 #roadmap .ongoing-grid .card-summary{order:2;margin:0 24px 24px}
 #roadmap .ongoing-grid .card-link{order:4;margin:0;padding:17px 24px;width:100%;background:#fff}
 #roadmap .ongoing-grid .timing{margin-left:0}
 #roadmap .ongoing-grid .card-art{order:3;width:100%;height:auto;min-height:194px;padding:22px;border-left:0;border-top:1px solid #e0e8e2;border-bottom:1px solid #e0e8e2;overflow:hidden}
 #roadmap .ongoing-grid .paper-visual{width:166px;min-width:0;padding:14px;transform:rotate(3deg)}
 #roadmap .ongoing-grid .platform-visual{width:158px;min-width:0;padding:16px;grid-template-columns:24px 1fr;gap:12px}
 #roadmap .ongoing-grid .mini-nav i{width:12px;height:12px}
 #roadmap .ongoing-grid .stat-art strong{font-size:62px}
 #roadmap .ongoing-grid .stat-art span{font-size:13px}
 #roadmap .ongoing-grid .stat-art small{font-size:12px}
}

/* Visual refinement. Keep the accepted Beta opening sizing and all page structure. */
.balanced-opening .premium-actions .micro{font-size:12px;line-height:1.55}
.balanced-opening .premium-quote figcaption{font-size:12px;line-height:1.65}
@media(max-width:640px){
 .balanced-opening .premium-actions{flex-wrap:wrap;gap:12px 16px;align-items:center}
 .balanced-opening .premium-actions .micro{font-size:12px}
 .balanced-opening .premium-quote figcaption{font-size:12px}
}

/* Approved consistency follow-through for Browse & read, calendar and tracker.
   Visual styling only: content, native links, state and navigation remain intact. */
#o2c-announcements.is-reader .o2c-entry[data-reader-selected]{background:#1c4e45;border-left-color:#1c4e45}
#o2c-announcements.is-reader .o2c-entry[data-reader-selected] :is(.o2c-entry-title,.o2c-entry-link){color:#fff!important}
#o2c-announcements.is-reader .o2c-entry[data-reader-selected] :is(.o2c-date,.o2c-type,.o2c-category,.o2c-match){color:#e0eee7!important}
#o2c-announcements.is-reader .o2c-entry[data-reader-selected] .o2c-entry-link:focus-visible::after{outline-color:#d4e8b8}
#o2c-announcements.is-reader .o2c-badges{align-items:baseline;gap:5px 9px}
#o2c-announcements.is-reader .o2c-type{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;font-size:11px!important;line-height:1.5!important}
#o2c-announcements.is-reader .o2c-category{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;font-size:12px!important;line-height:1.5!important;letter-spacing:normal!important;text-transform:none!important}
#o2c-announcements.is-reader .o2c-date,#o2c-announcements.is-reader .o2c-detail-hero>time{font-size:12px;line-height:1.5}
#o2c-announcements.is-reader .o2c-reader-panel-header{background:#fff}
#o2c-announcements.is-reader .o2c-reader-article .o2c-detail-hero{background:transparent;border:0;border-bottom:1px solid #dce5df;border-radius:0;padding:0 0 26px;margin:0 0 28px}
#o2c-announcements .o2c-calendar .rc-month-title{font-family:'O2C Lato',Lato,Arial,sans-serif;font-weight:700;line-height:1.1;letter-spacing:-.035em}
#o2c-announcements .o2c-calendar :is([data-rc-mode],[data-rc-filter],.rc-month-choice)[aria-pressed="true"]{background:#1c4e45!important;color:#fff!important;border-color:#1c4e45!important;box-shadow:none!important}
#o2c-announcements .o2c-calendar .rc-month-choice[aria-pressed="true"]>span{color:#fff!important}
#o2c-announcements .o2c-calendar .rc-month-choice[aria-pressed="true"] .rc-month-count{color:#e0eee7!important}
#o2c-announcements .o2c-calendar .rc-day.rc-selected{box-shadow:inset 0 0 0 2px #1c4e45}
#o2c-announcements .o2c-calendar .rc-day-top[aria-pressed="true"]{background:#1c4e45!important;color:#fff!important}
#o2c-announcements .o2c-calendar .rc-day-top[aria-pressed="true"] :is(time,span){color:#fff!important}
/* The tracker uses the same selection color and readable supporting labels. */
#lesson-refresh-tracker .filter[aria-pressed="true"]{background:#1c4e45;color:#fff;border-color:#1c4e45}
#lesson-refresh-tracker :is(.section-description,.eta-label,.status){font-size:12px;line-height:1.5}
