/* Beeld garden palette. Presentation only: no study state or course data. */
:root{--ink:#303b2b;--muted:#68705f;--paper:#f9f2ef;--line:#e6e6da;--green:#526537;--orange:#f98c53;--sage:#d2e0aa;--sky:#abd7fb;--peach:#fcceb4}
body{background:#edf0e3}
.entry-shell{background:var(--paper)}
.brand-mark{background:var(--orange);color:#3c3829;border-radius:15px;box-shadow:0 4px 0 #efddcf}
.brand{letter-spacing:0}.brand small{color:#68705f;letter-spacing:2.5px}
.header-note{background:#e7edda;color:#526537;padding:9px 14px;border-radius:30px}
.bottom-nav{border:0;border-top:1px solid #e7e7dd;background:#fffdfa;border-radius:26px 26px 0 0;box-shadow:0 -6px 24px #52653706;gap:8px;padding-inline:18px}
.bottom-nav a{color:#68705f;border-radius:22px;transition:background .18s,color .18s}
.bottom-nav a[aria-current]{background:#d2e0aa;color:#374626;font-weight:650}
.primary-button,.my-button.primary{background:#f98c53;color:#342b23;border-color:transparent;font-weight:650;box-shadow:0 4px 12px #dd804319}
.status-pill{background:#edf2e1;color:#526537}
.selection-panel,.memory-section,.my-panel,.empty-card{background:#fffdfa;border-color:#e8e6db;box-shadow:0 5px 18px #52653704;border-radius:24px}
.selection-fields select,.my-dialog input{background:#f7f8f0;border-color:#dfe5d0;border-radius:13px}
.selection-header,.my-heading,.memory-header{color:var(--ink)}
.memory-focus-entry{background:#fcceb4;border-color:transparent;border-radius:24px}
.memory-focus-entry :is(p,.memory-overline,.memory-entry-arrow){color:#775039}
.my-avatar{background:#d2e0aa;color:#46572e}.my-button{border-radius:14px;background:#f8faf2;color:#455633}
.my-profile{background:#e8efda;border-radius:17px;padding:12px}.my-links{color:#526537}
.theme-row{border-color:#e2e7d6;border-radius:25px;background:#f2f6e9}
.theme-row:nth-child(3n+2){background:#eef6fc}.theme-row:nth-child(3n){background:#fff1e6}
.theme-row.is-active{border-color:#a6b583;box-shadow:0 8px 25px #5265370d}
.theme-count,.task-level{background:#fffdf6;color:#526537;border-radius:20px}
.theme-viewport .task-row{border-color:#d8dfce}.progress-draw{background:#8a9d59}
.article-card{border-radius:22px;background:#fffdfa;border-color:#e8e6db}
.article-card:hover{border-color:#9aaf72}.article-search input,.article-filters select{border-radius:14px;background:#fffdfa}
.article-playback{background:#fffaf5;border-color:#e8e3d7}
.article-playback button{color:#4b5d33}.article-playback button[data-reader-play]{background:#d2e0aa}
.flash-card{border-color:#e4e4d5;box-shadow:0 8px 26px #53683a09}
.flash-header,.article-toolbar{color:#3c4d2c}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #647b3e;outline-offset:3px}

/* Home: the course illustrations are windows into the existing lesson scenes. */
#entry-main:has(.channels){grid-template-rows:auto minmax(92px,.55fr) minmax(0,1.85fr) auto;gap:14px;padding-top:12px}
#entry-main:has(.channels) .eyebrow{color:#6b7b46;letter-spacing:1.8px;font-size:11px}
#entry-main:has(.channels) h1{font-weight:700;letter-spacing:-.6px}
#entry-main:has(.channels) .lead{color:#68705f}
#entry-main:has(.channels) .stats-placeholder{background:#fffdfa;border:1px solid #e8e6db;box-shadow:0 4px 16px #52653704;border-radius:23px;padding:14px 19px}
#entry-main:has(.channels) .stat-grid strong{color:#526537;font-weight:650;font-variant-numeric:tabular-nums}
#entry-main:has(.channels) .stat-grid>div:first-child strong{color:#a85029}
#entry-main:has(.channels) .stat-grid span{color:#68705f}
#entry-main:has(.channels) .channel-grid{grid-template-rows:minmax(0,1.75fr) minmax(94px,.8fr);gap:12px}
#entry-main:has(.channels) .channel{border:0;border-radius:24px;padding:16px;overflow:hidden;transition:box-shadow .18s,filter .18s}
#entry-main:has(.channels) .channel-a1{background:#d2e0aa}
#entry-main:has(.channels) .channel-a2{background:#abd7fb}
#entry-main:has(.channels) .channel-top{margin:0;flex:none}
#entry-main:has(.channels) .level-pill{background:#fffdf9d9;border:0;color:#374626;font-size:12px;padding:5px 11px}
#entry-main:has(.channels) .channel-art{width:23px;height:23px;opacity:.8;color:#46572e}
.course-window{display:block;flex:1;min-height:28px;margin:10px 0;border-radius:16px;background-image:var(--protected-home-scene, linear-gradient(135deg,#dce7d5,#f5f0e4));background-size:200% auto;background-position:0 100%;background-repeat:no-repeat}
.channel-a2 .course-window{background-position:100% 0}
#entry-main:has(.channels) .channel h3{font-size:21px;line-height:1.3;letter-spacing:0}
#entry-main:has(.channels) .channel p{color:#4e5e3e;font-size:12px;line-height:1.4;margin:4px 0 9px}
#entry-main:has(.channels) .channel-a2 p{color:#405c6d}
#entry-main:has(.channels) .channel-action{font-size:12px;justify-content:space-between}
#entry-main:has(.channels) .channel-action .icon{background:#fffdfa90;border-radius:50%;width:23px;height:23px;padding:5px}
#entry-main:has(.channels) .channel-flash{background:#fcceb4}
#entry-main:has(.channels) .channel-articles{background:#e5eace}
#entry-main:has(.channels) :is(.channel-flash,.channel-articles){padding:14px;grid-template-columns:24px minmax(0,1fr);gap:5px 7px}
#entry-main:has(.channels) :is(.channel-flash,.channel-articles)>.icon{width:24px;height:24px;color:#485536}
#entry-main:has(.channels) :is(.channel-flash,.channel-articles) h3{font-size:15px}
#entry-main:has(.channels) :is(.channel-flash,.channel-articles) p{font-size:11px;margin:0;color:#5c5f4d}
#entry-main:has(.channels) :is(.channel-flash,.channel-articles) .channel-action{grid-row:3;grid-column:1/-1;width:100%;font-size:11px}
#entry-main:has(.channels) .home-note{color:#68705f;font-size:11px}
@media(min-width:960px) and (min-height:550px){
 .entry-shell{max-width:1160px;--page-pad:42px;box-shadow:0 0 70px #57633c0a}
 .entry-shell:has(.channels){--header-height:100px}
 #entry-main:has(.channels){grid-template-columns:minmax(260px,.85fr) minmax(0,1.35fr);grid-template-rows:1fr auto 1fr;gap:24px 40px;padding-top:26px;padding-bottom:26px}
 #entry-main:has(.channels)>.page-heading{grid-column:1;grid-row:1;align-self:end;padding-bottom:6px}
 #entry-main:has(.channels) h1{font-size:40px;line-height:1.35;max-width:330px;margin:12px 0}
 #entry-main:has(.channels) .lead{font-size:14px;line-height:1.8;max-width:270px}
 #entry-main:has(.channels) .stats-placeholder{grid-column:1;grid-row:2;padding:20px;min-height:125px}
 #entry-main:has(.channels) .channels{grid-column:2;grid-row:1/4}
 #entry-main:has(.channels) .channels>.section-line{margin-bottom:16px}
 #entry-main:has(.channels) .channel-grid{grid-template-rows:minmax(0,1fr) 132px;gap:16px}
 #entry-main:has(.channels) .channel{padding:20px}
 #entry-main:has(.channels) .home-note{grid-column:1;grid-row:3;text-align:left;align-self:start}
 .course-window{max-height:220px;margin:14px 0;background-size:200% auto}
 .entry-shell:has(.channels) .bottom-nav{width:calc(100% - 84px);justify-self:center;margin-bottom:16px;border-radius:25px;height:64px}
}
@media(max-width:600px){
 :root{--page-pad:20px}
 #entry-main:has(.channels){gap:12px}
 #entry-main:has(.channels) .channel h3{font-size:19px}
 #entry-main:has(.channels) .channel{padding:13px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles){padding:12px 11px;gap:4px 6px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles) h3{font-size:14px}
}
@media(max-height:750px) and (max-width:959px){
 .entry-shell:has(.channels){--header-height:58px}
 #entry-main:has(.channels){gap:8px;padding-top:5px;padding-bottom:7px;grid-template-rows:auto 85px minmax(0,1fr) auto}
 #entry-main:has(.channels) h1{font-size:23px;margin-bottom:4px}
 #entry-main:has(.channels) .lead{font-size:11px}
 #entry-main:has(.channels) .stats-placeholder{padding:9px 14px}
 #entry-main:has(.channels) .channel-grid{grid-template-rows:minmax(0,1fr) 94px;gap:9px}
 #entry-main:has(.channels) .channel{padding:10px 12px;border-radius:19px}
 #entry-main:has(.channels) .channel h3{font-size:17px}
 #entry-main:has(.channels) .channel p{font-size:11px;margin:3px 0 5px}
 #entry-main:has(.channels) .level-pill{font-size:11px;padding:3px 9px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles){padding:9px 11px;gap:3px 5px;grid-template-columns:18px minmax(0,1fr)}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles) h3{font-size:13px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles)>.icon{width:18px;height:18px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles) p{font-size:11px;margin:0}
 .course-window{position:absolute;right:12px;top:10px;width:40px;height:40px;min-height:0;margin:0;border-radius:50%;background-size:200% 200%}
 #entry-main:has(.channels) :is(.channel-a1,.channel-a2) .channel-top{min-height:36px;align-items:flex-start}
 #entry-main:has(.channels) .channel-art{visibility:hidden}
 #entry-main:has(.channels) .home-note{font-size:10px}
}
@media(min-width:601px) and (max-width:959px) and (min-height:501px) and (max-height:750px){.course-window{width:60px;height:60px}#entry-main:has(.channels) :is(.channel-a1,.channel-a2) .channel-top{min-height:54px}}
@media(min-width:650px) and (max-height:500px){
 #entry-main:has(.channels) :is(.channel-a1,.channel-a2) .channel-top{min-height:28px}
 #entry-main:has(.channels){grid-template-rows:auto minmax(76px,1fr) auto;gap:8px 20px;padding-top:4px}
 #entry-main:has(.channels) .channel-grid{grid-template-rows:minmax(0,1fr) 88px;gap:8px}
 #entry-main:has(.channels) .channel{padding:9px 12px;border-radius:18px}
 #entry-main:has(.channels) .channel h3{font-size:16px}
 #entry-main:has(.channels) .channel p{font-size:11px;margin:2px 0}
 .course-window{position:absolute;right:10px;top:7px;width:50px;height:50px;min-height:0;margin:0;border-radius:50%}
 #entry-main:has(.channels) .channel-art{visibility:hidden}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles){padding:9px 11px;gap:3px 6px}
 #entry-main:has(.channels) :is(.channel-flash,.channel-articles) h3{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.channel,.bottom-nav a{transition:none!important}}