/* Responsive learner dashboard for BrainOverload Build 7. */
.ui-icon{width:24px;height:24px;flex:0 0 auto;vertical-align:middle}
.brand-mark{width:66px;height:66px;display:block;flex:0 0 auto}
.learner-top{height:90px;padding:0 32px;gap:24px;box-shadow:0 1px 7px #09245109}
.learner-top .logo{gap:10px;flex:0 0 auto}
.learner-top .brand-words b{font-size:35px;letter-spacing:-2px;font-family:'Arial Rounded MT Bold',Arial,sans-serif;font-weight:900}
.learner-top .brand-words small{font-size:18px;letter-spacing:-1px}
.learner-top .brand-words em{margin:5px 0 0 25px;letter-spacing:4.4px;font-size:10px;color:#0d2757}
.learner-top .brand-words i{font-style:normal;font-size:11px;margin:0 7px;color:#00ab69}
.learner-top .brand-words i:last-child{color:#1680f7}
.header-search{position:relative;display:flex;align-items:center;width:min(360px,32vw);height:48px;margin:0 10px 0 auto;color:#152b5a}
.header-search>.ui-icon{position:absolute;left:15px;width:25px;height:25px;pointer-events:none}
.header-search input{height:100%;width:100%;border:1px solid #d6e0eb;border-radius:12px;background:#f8fafe;margin:0;padding:0 70px 0 50px;outline:0;color:#18315f}
.header-search input:focus{border-color:#1480f9;box-shadow:0 0 0 3px #1680f71f}
.header-search button{position:absolute;right:8px;border:0;background:transparent;color:#126fee;cursor:pointer;padding:7px;font-size:12px}
.learner-top .top-right{gap:21px;flex:0 0 auto}
.notification-link{position:relative;color:#0f285b;display:grid;place-items:center;width:44px;height:44px}
.notification-link .ui-icon{width:29px;height:29px}
.notification-dot{position:absolute;right:7px;top:2px;width:13px;height:13px;background:#f04437;border-radius:50%;box-shadow:0 0 0 3px white}
.learner-account{position:relative;margin:0;padding:0;border:0}
.learner-account summary{display:flex;align-items:center;gap:13px;list-style:none;cursor:pointer;font-weight:700;color:#0d2453;white-space:nowrap}
.learner-account summary::-webkit-details-marker{display:none}
.learner-account .user-dot{width:48px;height:48px;font-size:26px;border:3px solid #e2f5ed;background:#009e59}
.learner-account summary>.ui-icon{width:20px;height:20px;color:#0576ef}
.account-popover{position:absolute;right:0;top:55px;z-index:8;min-width:160px;background:white;border:1px solid #dce7ee;border-radius:12px;box-shadow:0 12px 24px #0a31512e;padding:10px}
.account-popover>a,.account-popover .text-button{display:block;width:100%;padding:9px 10px;text-align:left}
.account-popover form{margin:0}
.learner-shell{grid-template-columns:245px minmax(0,1fr);background:#f6fbfd}
.learner-shell .sidebar{padding:22px 18px;gap:7px;background:#fff}
.learner-shell .sidebar .nav-item{height:58px;padding:12px 14px;font-size:17px;gap:16px;border-radius:12px;font-weight:600}
.learner-shell .sidebar .nav-item span{width:34px;display:grid;place-items:center}
.learner-shell .sidebar .nav-item .ui-icon{width:30px;height:30px}
.learner-shell .sidebar .nav-item:hover,.learner-shell .sidebar .nav-item.active{background:#d9f8ea;color:#006f42}
.learner-shell .main{padding:15px 20px 32px 30px;max-width:none}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,2.05fr) minmax(350px,1fr);gap:12px;align-items:start}
.dashboard-primary,.dashboard-aside{min-width:0}
.dashboard-hero{position:relative;height:111px;display:flex;align-items:flex-start;overflow:hidden}
.dashboard-hero h1{font-family:'Arial Rounded MT Bold',Arial,sans-serif;font-size:clamp(35px,3.15vw,56px);letter-spacing:-2.3px;line-height:1.13;margin:0;color:#0d2857;font-weight:900;position:relative;z-index:1}
.dashboard-hero h1 span{color:#009e59}
.dashboard-hero p{font-size:clamp(18px,1.7vw,27px);font-weight:500;color:#476194;margin:2px 0;position:relative;z-index:1}
.hero-art{position:absolute;right:-5px;bottom:-1px;width:45%;height:112px;object-fit:contain;object-position:bottom right;pointer-events:none}
.learner-shell .card{border-color:#e5eff4;box-shadow:0 8px 25px #10295009;border-radius:14px}
.learner-shell h2,.learner-shell h3{font-family:'Arial Rounded MT Bold',Arial,sans-serif;color:#0d2857;letter-spacing:-.8px}
.learner-shell h2{font-size:28px}
.learner-shell .card-heading{margin:0 0 12px;align-items:center}
.learner-shell .card-heading h2{margin:0}
.learner-shell .card-heading p{font-size:17px;color:#526e9c;margin:3px 0 0}
.learner-shell .card-heading a{display:inline-flex;align-items:center;gap:8px;color:#0677ef;white-space:nowrap;font-size:15px}
.learner-shell .card-heading a .ui-icon{width:19px;height:19px}
.learner-shell .plan{padding:17px 22px 12px;margin-bottom:12px}
.learner-shell .plan .ghost{font-size:15px;border:1px solid #e1eaf2;border-radius:10px;padding:11px 14px;background:white}
.learner-shell .plan .ghost .ui-icon:first-child{color:#0077f0}
.learner-shell .lesson-row{display:grid;grid-template-columns:82px minmax(0,1fr) 165px 165px;gap:15px;align-items:center;margin:8px 0;min-height:92px;padding:8px 12px;border-color:#e5edf3;border-radius:12px;background:#fff}
.learner-shell .lesson-icon{height:72px;width:82px;border-radius:12px;font-size:30px}
.learner-shell .lesson-icon .ui-icon{width:42px;height:42px;stroke-width:2.1}
.learner-shell .subject-maths .lesson-icon{background:#fde9e9!important;color:#ef3b30!important}
.learner-shell .subject-english .lesson-icon{background:#def9ed!important;color:#007d46!important}
.learner-shell .subject-science .lesson-icon{background:#fff3d6!important;color:#eca400!important}
.learner-shell .subject-movement .lesson-icon{background:#e1f1ff!important;color:#087df0!important}
.learner-shell .subject-projects .lesson-icon{background:#f1e6ff!important;color:#8a4de0!important}
.learner-shell .lesson-info strong{font-family:'Arial Rounded MT Bold',Arial,sans-serif;font-size:20px;letter-spacing:-.5px;color:#0c2454;line-height:1.1}
.learner-shell .lesson-title{display:block;font-size:16px;color:#122951;line-height:1.22;margin-top:3px}
.learner-shell .lesson-title:hover{color:#087df0;text-decoration:underline}
.learner-shell .lesson-info div{font-size:16px;color:#122951;line-height:1.22;margin-top:3px}
.learner-shell .lesson-info small{font-size:13px;color:#4d6898;margin-top:3px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.learner-shell .lesson-state{width:auto;color:#122954;font-size:14px}
.learner-shell .lesson-state .badge{display:inline-flex;align-items:center;background:#eef1f5;padding:6px 11px;color:#253e68}
.learner-shell .lesson-state .badge.progress,.learner-shell .lesson-state .badge.done{background:#d9f8e9;color:#006939}
.learner-shell .lesson-state small{display:flex;align-items:center;gap:7px;margin:6px 0 0 6px;color:#18325d;font-size:14px}
.learner-shell .lesson-state small .ui-icon{width:19px;height:19px}
.learner-shell .lesson-row form{margin:0;width:100%}
.learner-shell .lesson-row form button{width:100%;height:52px;font-size:17px}
.learner-shell .lesson-button{width:100%;height:52px;display:grid;place-items:center;font-size:17px}
.learner-shell .lesson-button:hover{text-decoration:none;background:#0859d0}
.learner-shell .lesson-row .blue{background:#086df2}
.learner-shell .lesson-action{width:auto}
.dashboard-empty{min-height:185px;display:flex;align-items:center;gap:16px;color:#506f99;padding:24px}
.dashboard-empty>.ui-icon{width:40px;height:40px;color:#14a574}
.dashboard-empty strong{display:block;color:#0d2857;font-size:18px}
.dashboard-empty p{margin:4px 0}
.dashboard-empty a{margin-left:auto;display:inline-flex;align-items:center;white-space:nowrap;gap:5px}
.dashboard-empty a .ui-icon{width:18px;height:18px}
.week-plan{padding:16px 16px 10px;margin-bottom:0}
.week-heading{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap}
.week-heading span{color:#536c98;font-size:14px}
.learner-shell .week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.learner-shell .day{padding:5px 4px;border:1px solid #e8edf5;border-radius:8px;min-height:142px;background:#fff}
.learner-shell .day.is-today{border-color:#85d4fa;background:#f6fbff}
.learner-shell .day strong{font-size:11px;white-space:nowrap;margin-bottom:6px}
.learner-shell .day-pill{display:flex;align-items:center;gap:4px;font-size:11px;padding:3px 4px;margin:3px 0;border-radius:6px;color:#104b62;background:#e2f2fa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.learner-shell .day-pill:hover{text-decoration:none;filter:saturate(1.3) brightness(.96)}
.learner-shell .day-pill .ui-icon{width:14px;height:14px;stroke-width:2.5}
.learner-shell .day-pill.subject-maths,.next-tile.subject-maths{background:#fde7e9;color:#c82a2d}
.learner-shell .day-pill.subject-english,.next-tile.subject-english{background:#ddf7eb;color:#006f49}
.learner-shell .day-pill.subject-science,.next-tile.subject-science{background:#fff1d0;color:#a76c00}
.learner-shell .day-pill.subject-movement,.next-tile.subject-movement{background:#e2f1ff;color:#0e67ce}
.learner-shell .day-pill.subject-projects,.next-tile.subject-projects{background:#f2e7ff;color:#7540bd}
.learner-shell .day-pill.subject-digital,.next-tile.subject-digital{background:#def0ff;color:#0872d3}
.learner-shell .day-pill.subject-humanities,.next-tile.subject-humanities{background:#f1e2ff;color:#7945bd}
.dashboard-aside .card{margin-bottom:12px}
.dashboard-aside .goal{position:relative;min-height:107px;padding:14px 22px;background:url('/assets/goal-art.svg') right bottom/138px auto no-repeat,linear-gradient(105deg,#e5faf1 0%,#e5faf5 72%,#f9f8e6 100%);overflow:hidden}
.goal-heading{display:flex;align-items:flex-start;gap:13px;position:relative;z-index:1}
.goal-heading>.ui-icon{width:54px;height:54px;color:#007746;stroke-width:1.7}
.goal-heading h2{font-size:20px;margin:0 0 2px}
.goal-heading p{margin:0;font-size:14px;color:#0e2d4e}
.goal-progress{display:flex;align-items:center;gap:12px;margin:12px 130px 0 4px;position:relative;z-index:1;white-space:nowrap}
.goal-progress progress{width:100%;height:13px;accent-color:#00ad64;border:0;border-radius:30px;overflow:hidden}
.goal-progress progress::-webkit-progress-bar{background:#d8e3e8;border-radius:30px}
.goal-progress progress::-webkit-progress-value{background:#00ad64;border-radius:30px}
.goal-progress progress::-moz-progress-bar{background:#00ad64;border-radius:30px}
.goal-progress strong{font-size:14px;color:#153560}
.dashboard-aside .progress-card{padding:16px 22px 18px}
.progress-overview{display:flex;align-items:center;gap:20px;justify-content:space-around;margin:8px 0 12px}
.progress-ring{width:155px;height:155px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:conic-gradient(from -35deg,#00b96d 0 var(--pct),#dfe7ec var(--pct) 100%)}
.progress-ring>div{width:119px;height:119px;border-radius:50%;background:white;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.progress-ring strong{font-size:33px;color:#0e2859;line-height:1}
.progress-ring small{font-size:12px;line-height:1.15;color:#244263;margin-top:5px}
.progress-legend{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:16px;color:#24426a}
.progress-legend li{display:flex;align-items:center;gap:7px;white-space:nowrap}
.progress-legend strong{color:#112e5a}
.legend-dot{width:19px;height:19px;border-radius:50%;display:inline-block;margin-right:4px}
.legend-dot.green{background:#00ba6a}.legend-dot.blue{background:#72c6f8}.legend-dot.grey{background:#dfe6ec}
.streak-strip,.next-tile,.portfolio-tile,.submissions-tile{display:flex;align-items:center;gap:15px;border-radius:12px;text-decoration:none;color:#122a57;min-width:0}
.streak-strip:hover,.next-tile:hover,.portfolio-tile:hover,.submissions-tile:hover{text-decoration:none;filter:brightness(.98)}
.streak-strip{background:#fff4d7;padding:13px 15px;margin-bottom:19px}
.streak-strip>.ui-icon:first-child{width:51px;height:51px;color:#f4a700;fill:#f6b31d77}
.streak-strip span,.next-tile span,.portfolio-tile span,.submissions-tile span{min-width:0;flex:1}
.streak-strip strong,.streak-strip b,.streak-strip small,.next-tile strong,.next-tile small,.next-tile em,.portfolio-tile strong,.portfolio-tile small,.submissions-tile strong,.submissions-tile small{display:block}
.streak-strip strong{font-size:15px}.streak-strip b{font-size:25px;color:#102956;line-height:1.1}.streak-strip small{font-size:14px;color:#285571}
.streak-strip>.ui-icon:last-child,.next-tile>.ui-icon:last-child,.portfolio-tile>.ui-icon:last-child,.submissions-tile>.ui-icon:last-child{width:20px;height:20px}
.next-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 8px}
.next-heading h3{margin:0;font-size:22px}
.next-heading a{display:flex;align-items:center;gap:5px;font-size:14px;white-space:nowrap}
.next-heading a .ui-icon{width:18px;height:18px}
.next-tile,.portfolio-tile{padding:9px 12px;min-height:72px;margin-bottom:10px}
.next-tile{background:#fde9ea;color:#173459}
.portfolio-tile{background:#e5f2ff}
.next-icon{width:62px;height:58px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;background:#ffffffa6;color:#f03931}
.next-icon .ui-icon{width:34px;height:34px}
.portfolio-tile .next-icon{color:#f4ad00}
.next-tile strong,.portfolio-tile strong{font-size:16px;color:#102956}
.next-tile small,.portfolio-tile small{font-size:14px;color:#294d80;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.next-tile em{font-size:12px;color:#496d95;font-style:normal;margin-top:2px}
.dashboard-aside .submissions-card{padding:14px 20px}
.submissions-card .card-heading h2{font-size:22px}
.submissions-tile{background:#f0edff;padding:12px 14px;min-height:70px}
.submissions-tile>.ui-icon:first-child{width:40px;height:40px;color:#4231a6}
.submissions-tile strong{font-size:16px;color:#122956}.submissions-tile small{font-size:13px;color:#506a95;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-result{display:block}.search-result strong,.search-result span{display:block}.search-result span{color:#536e99;margin-top:5px}
.learner-top .top-right .notification-dot{display:block}
.learner-account[open] summary{margin-bottom:0}
@media(max-width:760px){.learner-shell .lesson-button{grid-column:2/-1;height:42px}.learner-shell .lesson-title{font-size:14px}}
@media(max-width:520px){.learner-shell .lesson-button{grid-column:1/-1}}
@media(max-width:1350px){.learner-top .brand-words b{font-size:30px}.learner-top .brand-words em{letter-spacing:3px}.brand-mark{width:58px;height:58px}.learner-shell{grid-template-columns:215px minmax(0,1fr)}.learner-shell .sidebar .nav-item{font-size:15px}.learner-shell .main{padding:18px}.dashboard-grid{grid-template-columns:minmax(0,1.7fr) minmax(310px,1fr)}.learner-shell .lesson-row{grid-template-columns:64px minmax(0,1fr) 120px 110px;gap:8px}.learner-shell .lesson-icon{width:64px}.learner-shell .lesson-row form button{padding:8px;font-size:14px}.progress-overview{gap:10px}.progress-ring{width:128px;height:128px}.progress-ring>div{width:98px;height:98px}.progress-ring strong{font-size:26px}.progress-legend{font-size:14px}.goal-progress{margin-right:85px}}
@media(max-width:1050px){.header-search{width:min(320px,30vw)}.dashboard-grid{grid-template-columns:1fr}.dashboard-aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dashboard-aside .goal{grid-column:1/-1}.dashboard-aside .card{margin-bottom:0}.dashboard-aside .progress-card{grid-row:span 2}.dashboard-hero{height:118px}.learner-shell .lesson-row{grid-template-columns:74px minmax(0,1fr) 145px 130px}.learner-shell .lesson-icon{width:74px}.goal-progress{margin-right:130px}}
@media(max-width:760px){.learner-top{height:auto;min-height:74px;flex-wrap:wrap;padding:8px 14px;gap:8px;position:relative}.brand-mark{width:47px;height:47px}.learner-top .brand-words b{font-size:23px}.learner-top .brand-words small{font-size:12px}.learner-top .brand-words em{font-size:7px;margin-left:8px;letter-spacing:2.2px}.learner-top .brand-words i{margin:0 3px}.learner-top .top-right{gap:4px;margin-left:auto}.learner-account .user-dot{width:37px;height:37px;font-size:19px}.learner-account .account-name{display:none}.notification-link{width:34px}.notification-link .ui-icon{width:23px;height:23px}.header-search{order:3;width:100%;margin:0;height:41px}.header-search input{padding-left:43px}.learner-shell{display:block}.learner-shell .sidebar{position:sticky;top:0;z-index:4;display:flex;flex-direction:row;overflow-x:auto;width:100%;padding:7px;gap:3px}.learner-shell .sidebar .nav-item{height:42px;white-space:nowrap;font-size:13px;gap:5px;padding:7px 9px}.learner-shell .sidebar .nav-item span{width:auto}.learner-shell .sidebar .nav-item .ui-icon{width:19px;height:19px}.learner-shell .main{padding:14px}.dashboard-hero{height:101px}.dashboard-hero h1{font-size:clamp(28px,6vw,40px);letter-spacing:-1.2px}.dashboard-hero p{font-size:17px}.hero-art{opacity:.65}.learner-shell .card{overflow:visible}.dashboard-grid{gap:12px}.dashboard-aside{grid-template-columns:1fr}.dashboard-aside .progress-card{grid-row:auto}.learner-shell .lesson-row{grid-template-columns:61px minmax(0,1fr) 125px;gap:8px}.learner-shell .lesson-icon{width:61px;height:61px}.learner-shell .lesson-icon .ui-icon{width:32px;height:32px}.learner-shell .lesson-row form,.learner-shell .lesson-action{grid-column:2/-1}.learner-shell .lesson-row form button{height:42px}.learner-shell .lesson-info strong{font-size:17px}.learner-shell .lesson-info div{font-size:14px}.learner-shell .week{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:5px}.learner-shell .day{min-width:118px;scroll-snap-align:start}.goal-progress{margin-right:115px}}
@media(max-width:520px){.learner-top .brand-words b{font-size:19px}.brand-mark{width:42px;height:42px}.learner-top .brand-words em{font-size:6px;letter-spacing:1.3px}.learner-shell .main{padding:10px}.dashboard-hero{height:92px;padding-top:7px}.dashboard-hero h1{font-size:27px}.dashboard-hero p{font-size:16px}.hero-art{width:42%;height:70px;opacity:.45}.learner-shell .plan{padding:15px 11px}.learner-shell h2{font-size:23px}.learner-shell .card-heading p{font-size:13px}.learner-shell .card-heading{align-items:flex-start}.learner-shell .plan .ghost{font-size:0;padding:8px}.learner-shell .plan .ghost .ui-icon{width:18px;height:18px}.learner-shell .lesson-row{grid-template-columns:56px minmax(0,1fr);gap:8px;padding:8px}.learner-shell .lesson-icon{height:57px;width:56px}.learner-shell .lesson-state{grid-column:2;display:flex;align-items:center;justify-content:space-between}.learner-shell .lesson-state small{margin:0}.learner-shell .lesson-row form{grid-column:1/-1}.dashboard-empty{display:block;padding:15px;min-height:0}.dashboard-empty a{margin-top:10px}.week-heading span{font-size:12px}.learner-shell .week-plan{padding:12px}.goal-progress{margin-right:90px}.progress-overview{justify-content:space-evenly}.progress-legend{font-size:13px}.dashboard-aside .progress-card{padding:14px}.streak-strip{padding:10px}.submissions-tile small{white-space:normal}}