/* Academy palette: edit these base colours to change the entire scheme.
   Derived tones and component roles below follow these values automatically.
   Bottle green is separate so Hifz can retain its established identity. */
:root {
  --palette-tan:#9e5f3c;
  --palette-forest:#3c5d41;
  --palette-bottle:#46635f;
  --palette-sage:#8c9385;
  --palette-gold:#d7ca9b;
  --palette-clay:#bd632f;
  --palette-paper:#faf8f3;
  --palette-ivory:#fff8ec;
  --palette-ink:#1f2921;
  --homepage-block-radius:16px;
  --dashboard-card-size:270px;
  --dashboard-card-gap:20px;
}
:root,.circle,.circles-theme {
  --theme-paper:var(--palette-paper);
  --theme-surface:var(--palette-ivory);
  --theme-gold:var(--palette-gold);
  --theme-soft:color-mix(in srgb,var(--palette-forest) 10%,var(--palette-paper));
  --theme-tan:var(--palette-tan);
  --theme-forest:var(--palette-forest);
  --theme-ink:var(--palette-ink);
  --theme-muted:color-mix(in srgb,var(--palette-sage) 57%,var(--palette-ink));
  --theme-line:color-mix(in srgb,var(--palette-sage) 65%,var(--palette-ivory));
  --theme-button:color-mix(in srgb,var(--palette-tan) 60%,var(--palette-ivory));
  --theme-button-hover:color-mix(in srgb,var(--palette-tan) 70%,var(--palette-ivory));
  --paper:var(--theme-paper);
  --surface:var(--theme-surface);
  --ink:var(--theme-ink);
  --muted:var(--theme-muted);
  --accent:var(--palette-forest);
  --soft:var(--theme-soft);
  --line:var(--theme-line);
  --warm:var(--palette-forest);
  --circle-paper:var(--theme-paper);
  --circle-surface:var(--theme-surface);
  --circle-ink:var(--theme-ink);
  --circle-muted:var(--theme-muted);
  --circle-accent:var(--palette-forest);
  --circle-line:var(--theme-line);
}
html,body.circle,body.circles-theme {background:var(--theme-paper);color:var(--theme-ink)}
.circle .site-header,.circle .public-home-header,.circles-theme .site-header {background:var(--theme-paper);color:var(--theme-ink);border-color:var(--theme-line)}
.circle :is(.brand-name,.brand-copy,.brand,.public-home-header a,.public-home-header button) {color:var(--theme-ink)}
.circle :is(.brand-byline,.academy-byline,.circles-header-dates,.public-visual-foot,.academy-footer,.academy-home-closing p) {color:var(--theme-muted)}
.circle .eyebrow,.circle .academy-welcome,.circle .academy-welcome [lang=ar] {color:var(--palette-forest)}
.circle :is(.eyebrow:before,.academy-welcome .eyebrow:before) {background:var(--palette-clay)}
.circle .single-circle-home #animated-hub.hub-website .hub-orb.hub-academy-centre {background:var(--theme-tan)!important;color:var(--theme-surface)!important}
.circle .single-circle-home #animated-hub.hub-website .hub-orb.hub-academy-centre :is(h1,p,em,.eyebrow) {color:var(--theme-surface)!important;opacity:1}
.circle .single-circle-home #animated-hub.hub-website .hub-image-copy {background:var(--palette-bottle)!important;color:var(--theme-surface)!important}
.circle .single-circle-home #animated-hub.hub-website .hub-image-copy :is(h3,p,.meta) {color:var(--theme-surface)!important;opacity:1}
.circle .single-circle-home #animated-hub.hub-website .hub-next.public-combined-worship {background:var(--theme-gold)!important;color:var(--theme-ink)!important;border-color:var(--theme-line)}
.circle .single-circle-home #animated-hub.hub-website .hub-next.public-combined-worship :is(h3,p,a,span) {color:inherit!important}
.circle .single-circle-home #animated-hub.hub-website .hub-progress {background:var(--palette-sage)!important;color:var(--theme-ink)!important;border-color:var(--theme-line)}
.circle .single-circle-home #animated-hub.hub-website .hub-progress :is(h3,p,.meta) {color:var(--theme-ink)!important;opacity:1}
.circle .single-circle-home #animated-hub.hub-website .hub-arabic {background:var(--theme-soft)!important;color:var(--palette-forest)!important;border-color:var(--theme-line)!important}
.circle .single-circle-home #animated-hub.hub-website .hub-arabic :is(h3,p) {color:inherit!important}
/* The same corners apply at every breakpoint, including image-backed cards. */
.circle .single-circle-home #animated-hub.hub-website :is(.hub-image,.hub-next,.hub-progress,.hub-arabic) {border-radius:var(--homepage-block-radius)!important;overflow:hidden}
.circle .single-circle-home #animated-hub.hub-website .hub-image-copy {border-radius:0!important}
.circle .btn,.circle .announcement-enrol {background:var(--palette-forest);color:var(--theme-surface);border-color:var(--palette-forest)}
.circle .btn.outline,.circle .public-login {background:transparent;color:var(--palette-forest);border-color:var(--palette-sage)}
.circle .btn:hover,.circle .announcement-enrol:hover {background:color-mix(in srgb,var(--palette-forest) 75%,var(--palette-ink));color:var(--theme-surface)}
.circle .btn.outline:hover,.circle .public-login:hover {background:var(--theme-surface);color:var(--palette-forest)}
.circle :is(.circles-header-home,.circles-header-refresh,.circles-header-sign-out,.public-replay,.text-button) {color:var(--palette-forest)}
.circle .public-home-header [data-circles-workspace] {color:var(--palette-forest);border-color:var(--palette-sage)}
.circle .public-home-header [data-circles-workspace][aria-pressed=true] {background:var(--palette-forest);color:var(--theme-surface)}
.circle .circles-account-menu,.circle .circles-sign-in {background:var(--theme-surface);color:var(--theme-ink);border-color:var(--theme-line)}
.circle .circles-sign-in::backdrop {background:color-mix(in srgb,var(--palette-ink) 50%,transparent)}
.circle .circles-sign-in :is(input,button) {border-color:var(--theme-line)}
.circle .circles-sign-in input {background:color-mix(in srgb,var(--palette-paper) 60%,var(--palette-ivory));color:var(--theme-ink);accent-color:var(--palette-forest)}
.circle .academy-news {background:var(--theme-tan)!important;color:var(--theme-surface)!important}
.circle .academy-news>.section-head :is(.eyebrow,h2) {color:var(--theme-surface)!important}
.circle .academy-news>.section-head .eyebrow:before {background:var(--palette-gold)}
.circle .announcements-collage .announcement-summary-list>button {background:var(--theme-gold);color:var(--theme-ink);border-color:var(--theme-line)}
.circle .announcements-collage .announcement-summary-list>button:hover {background:var(--theme-surface)}
.circle .announcements-collage .announcement-summary-list>button :is(small,strong,span) {color:inherit}
.circle :is(.announcement-viewer,.announcement-viewer>header,.news-intehaan) {background:var(--theme-surface);color:var(--theme-ink);border-color:var(--theme-line)}
.circle .announcement-viewer>header button {background:var(--theme-paper);color:var(--palette-forest);border-color:var(--theme-line)}
.circle .announcement-display {--an-ink:var(--theme-ink);--an-plum:var(--palette-forest);--an-sage:var(--palette-forest);--an-paper:var(--theme-surface);--an-line:var(--theme-line)}
.circle .announcement-display .announcement-feature-art {background:var(--theme-soft)!important}
.circle .announcement-display :is(.announcement-kicker,.announcement-summary,.announcement-pager span,.announcement-choice-summary,.announcement-index-heading) {color:var(--theme-muted)!important}
.circle .announcement-display .announcement-index {background:var(--theme-gold)}
.circle .announcement-display .announcement-index nav>button {color:var(--theme-muted)!important}
.circle .announcement-display .announcement-index nav>button[aria-current=true] {background:var(--theme-surface)!important}
.circle .announcement-display :is(.announcement-feature-actions button,.announcement-pager button) {border-color:var(--palette-sage)!important;color:var(--palette-forest)!important}
.circle .announcement-display .announcement-feature-actions .announcement-enrol-button {background:var(--palette-forest)!important;color:var(--theme-surface)!important}
.circle .announcement-reader,.circle .announcement-reader>header {background:var(--theme-surface);color:var(--theme-ink);border-color:var(--theme-line)}
.circle .announcement-reader::backdrop {background:color-mix(in srgb,var(--palette-ink) 65%,transparent)}
.circle .announcement-reader :is(.announcement-kicker,.announcement-reader-summary,.announcement-full-message,.announcement-contact) {color:var(--theme-muted);border-color:var(--theme-line)}
.circle .announcement-reader :is(button,a) {color:var(--palette-forest);border-color:var(--theme-line)}
.circle .free-course-card .free-course-art[data-card-standard=green] {border-color:var(--palette-forest);background:var(--theme-soft)}
.circle :is(.homepage-course-caption,.course-artwork-caption) {background:linear-gradient(0deg,color-mix(in srgb,var(--palette-forest) 72%,var(--palette-ink)),color-mix(in srgb,var(--palette-forest) 95%,transparent));color:var(--theme-surface)}
.circle .homepage-course-caption .access-badge {background:var(--theme-surface);color:var(--palette-forest)}
.circle .academy-invitation {background:var(--theme-soft);color:var(--theme-ink);border-color:var(--theme-line)}
.circle .academy-teaching {background:var(--theme-forest);color:var(--theme-surface)}
.circle .academy-teaching :is(h2,p,.eyebrow) {color:var(--theme-surface)}
.circle .academy-invitation :is(h2,p,.eyebrow),.circle .academy-story h2 {color:var(--palette-forest)}
.circle .academy-invitation {background:var(--theme-tan);color:var(--theme-surface)}
.circle .academy-invitation :is(h2,p,.eyebrow) {color:var(--theme-surface)}
.circle .academy-invitation .btn {background:var(--theme-surface);color:var(--palette-forest);border-color:var(--theme-surface)}
.circle .academy-invitation .btn.outline {background:transparent;color:var(--theme-surface);border-color:var(--theme-surface)}
.circle .academy-invitation .btn:hover {background:color-mix(in srgb,var(--palette-gold) 25%,var(--palette-ivory));color:var(--palette-forest);border-color:color-mix(in srgb,var(--palette-gold) 25%,var(--palette-ivory))}
.circle .academy-story h2 em {color:var(--theme-tan)}
.circle :is(.rule,.academy-footer,.academy-footer-links,.academy-footer-note) {border-color:var(--theme-line)}
#circles-dashboard {--paper:var(--theme-paper);--ink:var(--theme-ink);--muted:var(--theme-muted);--line:var(--theme-line);--plum:var(--palette-forest);--wheel-active:var(--palette-tan);--wheel-next:color-mix(in srgb,var(--palette-tan) 60%,var(--palette-ivory));--wheel-later:color-mix(in srgb,var(--palette-tan) 26%,var(--palette-ivory));--wheel-finished:color-mix(in srgb,var(--palette-tan) 11%,var(--palette-ivory));--wheel-unused:color-mix(in srgb,var(--palette-tan) 5%,var(--palette-ivory));--wheel-line:color-mix(in srgb,var(--palette-tan) 35%,var(--palette-ivory));--wheel-muted:color-mix(in srgb,var(--palette-tan) 60%,var(--palette-ink));--grid-paper:color-mix(in srgb,var(--palette-paper) 55%,var(--palette-ivory));--grid-today:color-mix(in srgb,var(--palette-tan) 9%,var(--palette-ivory));--grid-card:color-mix(in srgb,var(--palette-tan) 11%,var(--palette-ivory));--grid-heading:color-mix(in srgb,var(--palette-tan) 26%,var(--palette-ivory));--grid-ink:color-mix(in srgb,var(--palette-tan) 45%,var(--palette-ink));color:var(--theme-ink)}
#circles-dashboard :is(.circles-hub-menu button,.circles-programme-link,.circles-manage button) {background:var(--theme-button);color:var(--theme-ink);border-color:var(--wheel-line)}
#circles-dashboard :is(.circles-hub-menu button,.circles-programme-link,.circles-manage button):hover {background:var(--theme-button-hover)}
#circles-dashboard :is(.circles-dashboard-welcome,.day-date>span,.attention-count,.attention-kind,.attention-item div>p:not(.attention-kind),.attention-footer p,.circles-dashboard-freshness,.wheel-summary) {color:var(--theme-muted)}
#circles-dashboard .circles-attention {background:var(--theme-surface);border-color:var(--theme-line)}
#circles-dashboard :is(.attention-item,.attention-footer,.attention-icon) {border-color:var(--theme-line)}
#circles-dashboard .attention-icon {color:var(--palette-forest)}
#circles-dashboard .attention-footer>span {color:var(--palette-clay)}
#circles-dashboard :is(.circles-hub-menu>.eyebrow,.circles-today .eyebrow,.circles-attention>.eyebrow,.attention-item button,.day-date button) {color:var(--palette-forest)}
#circles-dashboard :is(.circles-today .eyebrow:before,.circles-attention>.eyebrow:before) {background:var(--palette-clay)}
#circles-dashboard .wheel-sector.active,#circles-dashboard .legend-active {fill:var(--wheel-active);background:var(--wheel-active)}
#circles-dashboard .wheel-sector.next,#circles-dashboard .legend-next {fill:var(--wheel-next);background:var(--wheel-next)}
#circles-dashboard .wheel-sector.later,#circles-dashboard .legend-later {fill:var(--wheel-later);background:var(--wheel-later)}
#circles-dashboard .wheel-sector.finished,#circles-dashboard .legend-finished {fill:var(--wheel-finished);background:var(--wheel-finished)}
#circles-dashboard .wheel-sector.unused {fill:var(--wheel-unused)}
#circles-dashboard .wheel-ring {stroke:var(--wheel-line)}
#circles-dashboard .wheel-session {color:var(--theme-ink)}
#circles-dashboard .wheel-session.finished {color:var(--wheel-muted)}
#circles-dashboard .wheel-session.active {color:var(--theme-surface)}
#circles-dashboard .wheel-session :is(.session-subject,.session-time,.session-hint) {opacity:1}
#circles-dashboard .session-join:not(:disabled),#circles-dashboard .week-join:not(:disabled) {background:var(--theme-surface);color:var(--wheel-active);border-color:var(--wheel-line)}
#circles-dashboard .wheel-centre {background:var(--theme-surface);color:var(--wheel-active);box-shadow:0 0 0 8px color-mix(in srgb,var(--palette-paper) 40%,transparent)}
#circles-dashboard .circles-week {color:var(--grid-ink)}
#circles-dashboard .circles-week :is(.eyebrow,header>p,.week-help,.week-empty) {color:var(--wheel-muted)}
#circles-dashboard .week-table-scroll {background:var(--grid-paper);border-color:var(--wheel-line)}
#circles-dashboard .circles-week th,#circles-dashboard .circles-week td {border-color:var(--wheel-line)}
#circles-dashboard .circles-week thead th {background:var(--grid-card);color:var(--grid-ink)}
#circles-dashboard .circles-week thead time {color:var(--wheel-muted)}
#circles-dashboard .circles-week th[aria-current=date] {background:var(--grid-heading)}
#circles-dashboard .circles-week tbody th {background:var(--grid-paper);color:var(--wheel-muted)}
#circles-dashboard .circles-week td {background:var(--grid-paper)}
#circles-dashboard .circles-week td.is-today {background:var(--grid-today)}
#circles-dashboard .week-lesson {background:var(--grid-card);color:var(--grid-ink);border-color:var(--wheel-line)}
#circles-dashboard .week-lesson.is-active {background:var(--wheel-active);color:var(--theme-surface);border-color:var(--wheel-active)}
#circles-dashboard .week-lesson.is-finished {background:var(--wheel-finished);color:var(--wheel-muted);border-color:var(--wheel-line)}
#circles-dashboard .circles-week :focus-visible {outline-color:var(--wheel-active)}
#circles-dashboard .week-lesson.is-active :focus-visible {outline-color:var(--theme-surface)}
.circle :focus-visible {outline-color:var(--palette-forest)}
.circle .hub-orb :focus-visible,#circles-dashboard .wheel-session.active :focus-visible {outline-color:var(--theme-surface)}

/* Give the learning circle more room and keep attention items compact. */
@media(min-width:1101px) {
  #circles-dashboard .circles-dash-layout {grid-template-columns:142px minmax(0,1.75fr) minmax(280px,1fr);gap:28px}
  #circles-dashboard .circles-attention {padding:22px}
  #circles-dashboard .circles-attention h2 {font-size:30px}
  #circles-dashboard .attention-item {padding:19px 0;gap:12px}
  #circles-dashboard .attention-item h3 {font-size:23px}
  #circles-dashboard .attention-footer {padding-top:20px}
  #circles-dashboard .attention-footer p {font-size:22px}
}
@media(min-width:1550px) {
  #circles-dashboard .circles-dash-layout {grid-template-columns:155px minmax(0,1.85fr) minmax(300px,1fr);gap:32px}
  #circles-dashboard :is(.circles-programme-links,.circles-manage,.circles-dashboard-freshness) {margin-left:187px}
}
@media(min-width:851px) and (max-width:1100px) {
  #circles-dashboard .circles-dash-layout {grid-template-columns:100px minmax(0,1.4fr) minmax(230px,1fr);gap:18px}
  #circles-dashboard .circles-attention {padding:18px}
  #circles-dashboard .circles-attention h2 {font-size:27px}
  #circles-dashboard .attention-item {padding:16px 0;gap:9px}
  #circles-dashboard .attention-item h3 {font-size:21px}
}

/* Reuses the existing Tafseer artwork renderer; only the container is a rail. */
.circle .circles-tafseer-rail {margin-top:36px;min-width:0}
.circle .circles-tafseer-rail>header {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}
.circle .circles-tafseer-rail h2 {font:400 34px/1.15 'Libre Caslon Display',Georgia,serif;margin:0;color:var(--theme-ink)}
.circle .circles-tafseer-rail>header>a {font:500 12px/1.5 'DM Sans',Arial,sans-serif;color:var(--palette-forest);text-underline-offset:5px;flex:none}
.circle .circles-tafseer-rail .circles-collection-nav {display:none}
.circle .circles-tafseer-rail .connected-circles {padding:0}
.circle .circles-tafseer-rail .collection-grid {display:flex;gap:var(--dashboard-card-gap);overflow-x:auto;padding:3px 1px 14px;scroll-snap-type:x proximity}
.circle #programmes.circles-dashboard-courses .circles-purchased-course-row {gap:var(--dashboard-card-gap)}
.circle .circles-tafseer-rail .collection-card,.circle #programmes.circles-dashboard-courses .circles-purchased-course {flex:0 0 var(--dashboard-card-size);min-width:0;scroll-snap-align:start}
.circle .circles-tafseer-rail [hidden] {display:none!important}
.circle .circles-tafseer-rail .collection-cover.tafseer-cover {position:relative;display:flex;align-items:center;justify-content:center;padding:22px 22px 50px;overflow:hidden;text-decoration:none;container-type:inline-size;box-sizing:border-box;width:100%;height:auto;aspect-ratio:1;border:1px solid var(--theme-line);border-radius:var(--homepage-block-radius);--card-accent:var(--palette-tan)!important;--card-soft:var(--palette-ivory)!important;--ornament:var(--palette-tan);background:var(--theme-surface)}
.circle .circles-tafseer-rail .tafseer-cover:before {content:'';position:absolute;inset:0;background:url('/_assets/1331bf455d94548f6bdc308174942ac05dc9373597a7c840c47b17a8f1fc1212/shared/assets/tafseer-geometric.svg') center/58px repeat;opacity:.25}
.circle .circles-tafseer-rail .tafseer-cover:after {content:'';position:absolute;inset:17% 13%;border-radius:50%;background:var(--theme-surface);box-shadow:0 0 26px 24px var(--theme-surface)}
.circle .circles-tafseer-rail .tafseer-frame {position:absolute;inset:7px;z-index:1;color:var(--ornament);pointer-events:none}
.circle .circles-tafseer-rail .tafseer-frame>svg {width:100%;height:100%;stroke:currentColor;stroke-width:.85}
.circle .circles-tafseer-rail .tafseer-frame>svg>path:nth-child(2) {opacity:.5;stroke-width:.55}
.circle .circles-tafseer-rail .tafseer-lettering {position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;text-align:center;color:var(--card-accent);font-family:Amiri,'Geeza Pro',serif;font-weight:400;transform:translateY(5px)}
.circle .circles-tafseer-rail .tafseer-prefix {font-size:21px;line-height:1.05;margin-bottom:-7px}
.circle .circles-tafseer-rail .tafseer-surah-name {font-size:clamp(40px,27cqi,68px);line-height:1.35;white-space:nowrap}
.circle .circles-tafseer-rail .tafseer-flourish {width:78px;height:14px;margin-top:10px;color:var(--ornament);stroke:currentColor;stroke-width:.8}
.circle .circles-tafseer-rail .tafseer-english {position:absolute;bottom:42px;left:16px;right:16px;z-index:3;color:var(--card-accent);font:500 12px/1.4 'DM Sans',sans-serif;text-align:center;letter-spacing:.025em}
.circle .circles-tafseer-rail .collection-lock.access-badge {position:absolute;bottom:10px;right:10px;z-index:4;display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:14px;font:600 10px/1.2 'DM Sans',sans-serif;background:var(--theme-paper);color:var(--theme-ink)}
.circle .circles-tafseer-rail .access-badge svg {width:13px;height:13px;flex-shrink:0}
#circles-dashboard .circles-programme-link[hidden] {display:none!important}
@media(max-width:700px) {.circle .circles-tafseer-rail h2 {font-size:29px}}