#student-shell {background:#f7f5ed;color:#303c38;--dash-purple:#426b59;--dash-line:#e0e3d8;--dash-muted:#69746d}
#student-shell .dashboard-content {background:transparent}
#student-shell .dashboard-special a {background:#e9efda}
#student-shell .explore-hero {position:relative;background:#e5ebda;border:1px solid #d3ddc6;border-radius:4px 48px 4px 4px;padding:30px 34px;margin-bottom:28px;overflow:hidden}
.explore-eyebrow {font-size:10px;letter-spacing:2px;font-weight:700;color:#52684e;margin-bottom:18px}
#student-shell .explore-hero .hero-subtitle {color:#53624e}
.explore-invitation {display:flex;align-items:center;gap:18px;margin-top:22px;padding-top:18px;border-top:1px solid #cbd6be}
.explore-invitation img {width:82px;height:82px;flex-shrink:0;animation:explore-hover 4s ease-in-out infinite}
.explore-invitation strong {font-size:16px}.explore-invitation p {font-size:13px;margin:6px 0 12px;color:#52634f}
#student-shell .fei-picks {margin:0 0 34px;padding:0;border:0;background:none;box-shadow:none}
#student-shell .start-recommend-heading {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
#student-shell .start-recommend-heading h2 {font:600 16px Montserrat,sans-serif;margin:0 0 7px}
#student-shell .start-recommend-heading p {font-size:12px;color:#69746d;margin:0}
#student-shell .start-recommend-heading button {background:transparent;border:1px solid #b8c3b0;border-radius:20px;padding:10px 14px;color:#3e5a48;cursor:pointer}
#student-shell .start-course-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0;list-style:none;margin:0}
#student-shell .start-course-list li {min-width:0;border:0}
#student-shell .start-course-list a {display:flex;flex-direction:column;align-items:stretch;height:100%;padding:0;background:#fffdf7;border:1px solid #e3dfd1;border-radius:4px 22px 4px 4px;overflow:hidden;text-decoration:none;color:#303c38;transition:transform .2s}
#student-shell .start-course-list a:hover {transform:translateY(-4px)}
#student-shell .start-course-list img {width:100%;height:170px;object-fit:cover;background:#e7e7de}
#student-shell .pick-copy {display:flex;flex-direction:column;gap:9px;padding:18px;flex:1}
#student-shell .pick-copy strong {font:600 16px Montserrat,sans-serif}
#student-shell .pick-copy small {font-size:12px;line-height:1.6;color:#69746d}
#student-shell .pick-copy .pick-label {font:600 9px "Open Sans",sans-serif;letter-spacing:1.5px;color:#836c43}
#student-shell .pick-copy b {font-size:11px;color:#456c58;margin-top:auto;padding-top:10px}
#student-shell .explore-portals {gap:20px;margin-bottom:34px}
#student-shell .explore-portals .track-card {position:relative;background:#e4ebf2;color:#303f51;border:0;border-radius:4px 42px 4px 4px;padding:28px;min-height:330px;box-shadow:none;isolation:isolate}
#student-shell .explore-portals .track-creation {background:#f1dfce;color:#644332}
#student-shell .explore-portals .track-card:before {content:'';position:absolute;width:140px;height:140px;background:#cfdae6;right:-42px;top:-60px;transform:rotate(35deg);z-index:-1}
#student-shell .explore-portals .track-creation:before {background:#e7c7aa}
#student-shell .explore-portals .track-emoji {float:right;width:110px;height:110px;margin:0 0 16px 14px}
#student-shell .track-emoji img {width:100%;height:100%;object-fit:cover;clip-path:polygon(20% 0,100% 0,100% 80%,80% 100%,0 100%,0 20%)}
#student-shell .explore-portals .track-name {font:600 26px Montserrat,sans-serif;color:inherit;display:block}
#student-shell .explore-portals .track-age-pill {display:table;margin-top:10px;font-size:9px;background:#ffffff80;color:inherit}
#student-shell .explore-portals .track-quote {clear:both;padding-top:16px;color:inherit;font-size:17px;font-style:normal;line-height:1.4}
#student-shell .explore-portals .track-description {color:inherit;opacity:.85;font-size:13px;line-height:1.7;max-width:390px}
#student-shell .explore-portals .track-progress {color:inherit;font-size:10px;margin-top:18px}
#student-shell .explore-portal-link {display:block;font-size:12px;font-weight:700;margin-top:20px}
#student-shell .journey-map {background:#fffdf8}
.explore-highlight {outline:3px solid #937db6!important;outline-offset:5px}
#explore-tour {position:fixed;z-index:9999;width:min(330px,calc(100vw - 24px));box-sizing:border-box;padding:22px;background:#fffdf5;border:1px solid #cbbadb;border-radius:20px;box-shadow:0 12px 45px #303c3830;transition:left .55s ease,top .55s ease;color:#343e36}
#explore-tour[hidden] {display:none}
#explore-tour>img {position:absolute;width:70px;height:70px;right:8px;top:-51px;animation:explore-hover 2.8s ease-in-out infinite}
#explore-tour small {font:700 9px "Open Sans",sans-serif;letter-spacing:1px;color:#7c639b}
#explore-tour h3 {font:600 16px Montserrat,sans-serif;margin:12px 0}
#explore-tour p {font:13px/1.65 "Open Sans",sans-serif;margin:0 0 16px}
.explore-tour-actions {display:flex;gap:7px;justify-content:space-between}
.explore-tour-actions button {border:1px solid #ddd6e3;border-radius:18px;background:#fffdf5;padding:10px 12px;cursor:pointer;font-size:11px}
.explore-tour-actions [data-next] {background:#516a55;color:white;border-color:#516a55}
@keyframes explore-hover {50%{transform:translateY(-7px) rotate(3deg)}}
@media(max-width:680px){#student-shell .explore-hero{padding:24px 20px}.explore-eyebrow{line-height:1.7}.explore-invitation{gap:9px}.explore-invitation img{width:60px;height:60px}#student-shell .start-course-list{grid-template-columns:1fr}#student-shell .start-course-list a{display:grid;grid-template-columns:110px 1fr}#student-shell .start-course-list img{height:100%;min-height:180px}#student-shell .pick-copy{padding:14px}#student-shell .explore-portals{grid-template-columns:1fr}#student-shell .explore-portals .track-card{padding:24px}#student-shell .start-recommend-heading{align-items:flex-start;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){#explore-tour,#explore-tour img,.explore-invitation img{animation:none;transition:none}}
#student-shell .explore-portals .track-card {display:block;overflow:hidden}
#student-shell .explore-portals .track-name {font-size:26px!important}
#student-shell #resume-card {background:#536c59;box-shadow:none}
#student-shell .hero-name,#student-shell #hero-name {color:#426347}
/* Real course glimpses, arranged like small prints on a studio table. */
#student-shell .explore-portals .track-emoji {position:relative;float:none;display:block;width:100%;height:190px;margin:0 0 24px!important;font-size:initial!important}
#student-shell .portal-photo {position:absolute;display:block;box-sizing:border-box;width:44%;height:150px;top:16px;left:2%;padding:5px;background:#fffdf5;border:1px solid #dedbd1;box-shadow:0 5px 12px #38402a24;transform:rotate(-10deg)}
#student-shell .portal-photo:nth-child(2) {left:27%;top:5px;transform:rotate(5deg)}
#student-shell .portal-photo:nth-child(3) {left:53%;top:30px;transform:rotate(12deg)}
#student-shell .track-skills .portal-photo {width:37%;height:138px}
#student-shell .track-skills .portal-photo:nth-child(2) {left:21%;top:4px}
#student-shell .track-skills .portal-photo:nth-child(3) {left:59%;top:18px;transform:rotate(9deg)}
#student-shell .track-skills .portal-photo:nth-child(4) {left:38%;top:45px;transform:rotate(-5deg)}
#student-shell .track-emoji .portal-photo img {display:block;width:100%;height:100%;object-fit:cover;clip-path:none}
#student-shell .portal-cardboard {background-image:url('../material-art/cardboard/assets/gothic/project-map.png');background-size:330% auto;background-position:100% 91%;background-repeat:no-repeat;border:5px solid #fffdf5}
#student-shell .explore-portals .track-quote {padding-top:10px}
@media(max-width:420px){#student-shell .explore-portals .track-emoji{height:160px}#student-shell .portal-photo{height:125px}#student-shell .track-skills .portal-photo{height:110px}}
/* Three calm landing areas: a compact set of sparks, then two destinations. */
#student-shell .explore-hero {padding:18px 24px;margin-bottom:20px;border:0;background:transparent;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
#student-shell .explore-eyebrow,#student-shell .explore-hero .hero-greeting,#student-shell .explore-hero .hero-subtitle {display:none}
#student-shell .explore-hero .hero-title {margin:0;font-size:22px}
#student-shell .explore-invitation {margin:0 0 0 auto;padding:0;border:0;gap:4px}
#student-shell .explore-invitation img {width:48px;height:48px}
#student-shell .explore-invitation strong,#student-shell .explore-invitation p {display:none}
#student-shell .explore-invitation .dashboard-button {background:transparent;border:0;padding:8px;font-size:11px}
#student-shell .start-recommend-heading h2 {font-size:18px}
#student-shell .fei-picks {margin-bottom:24px}
#student-shell .start-course-list {gap:12px}
#student-shell .start-course-list a {display:grid;grid-template-columns:88px minmax(0,1fr);border-radius:8px}
#student-shell .start-course-list img {height:100%;min-height:112px}
#student-shell .pick-copy {padding:12px;gap:6px}
#student-shell .pick-copy strong {font-size:15px}
#student-shell .pick-copy small {font-size:11px;line-height:1.4}
#student-shell .pick-label,#student-shell .pick-copy b {display:none}
#student-shell .studio-direction {min-width:0;display:flex;flex-direction:column;background:#e4ebf2;border-radius:4px 42px 4px 4px;overflow:hidden}
#student-shell .creation-direction {background:#f1dfce}
#student-shell .studio-direction .track-card {background:transparent;flex:1;margin:0;padding-bottom:18px;min-height:0;border-radius:0}
#student-shell .studio-direction .track-card:hover {transform:none;box-shadow:none;background:#ffffff30}
#student-shell .studio-direction .track-progress,#student-shell .studio-direction .track-bar {display:none}
#student-shell .studio-direction .track-name {font-size:26px!important}
#student-shell .studio-direction .track-description {min-height:68px}
#student-shell .studio-continue {margin:0 28px 26px;padding-top:18px;border-top:1px solid #54677930}
#student-shell .studio-continue h3 {font-size:13px;margin:0 0 12px;color:#344a4d}
#student-shell .studio-continue h3 span {font-weight:400;opacity:.65}
#student-shell .studio-continue p {font-size:12px;line-height:1.65;color:#596669;margin:0}
#student-shell .studio-continue ul {list-style:none;margin:0;padding:0}
#student-shell .studio-continue a {display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid #54677920;color:#344a4d;text-decoration:none;font-size:12px}
#student-shell .studio-continue a:hover {text-decoration:underline}
#student-shell .studio-continue a span {overflow-wrap:anywhere}
#student-shell .studio-continue b {font-size:10px;white-space:nowrap}
#student-shell .studio-continue summary {font-size:11px;padding:12px 0;cursor:pointer}
#student-shell .skill-gallery-heading {text-align:left!important;padding:32px 0 20px;margin:0!important}
#student-shell .skill-gallery-heading .section-title {font:600 24px Montserrat,sans-serif!important;margin-bottom:12px}
#student-shell .skill-gallery {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:32px}
#student-shell .skill-gallery .subtrack {display:flex;flex-direction:column;align-items:stretch;padding:0;margin:0;background:#fffdf7;border:1px solid #e0ddd2;border-radius:6px 24px 6px 6px;overflow:hidden;position:relative}
#student-shell .skill-gallery .subtrack-emoji {width:100%;height:210px;margin:0;background:#e5e7df;flex:none}
#student-shell .skill-gallery img {width:100%;height:100%;object-fit:cover}
#student-shell .skill-gallery .subtrack:last-child img {object-position:100% 94%;height:310%;width:310%;max-width:none;transform:translate(-67%,-67%)}
#student-shell .skill-gallery .subtrack:last-child .subtrack-emoji {overflow:hidden}
#student-shell .skill-gallery .subtrack-info {padding:20px;min-width:0}
#student-shell .skill-gallery .subtrack-name {font:600 18px Montserrat,sans-serif;color:#344a40}
#student-shell .skill-gallery .subtrack-meta {font-size:10px;margin:10px 0;color:#748071}
#student-shell .skill-gallery-description {font-size:13px;line-height:1.6;color:#52645a;margin:10px 0 24px}
#student-shell .skill-gallery .subtrack-arrow {position:absolute;bottom:16px;right:20px;color:#426b59}
@media(max-width:1000px){#student-shell .skill-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}#student-shell .start-course-list a{grid-template-columns:64px minmax(0,1fr)}}
@media(max-width:680px){#student-shell .explore-hero{padding:0;gap:6px}#student-shell .start-course-list a{grid-template-columns:80px minmax(0,1fr)}#student-shell .start-course-list img{min-height:84px}#student-shell .skill-gallery{grid-template-columns:1fr}#student-shell .studio-continue{margin:0 24px 24px}#student-shell .studio-direction .track-description{min-height:0}#student-shell .skill-gallery-heading .section-title{font-size:22px!important}}
#student-shell .skill-gallery .subtrack-emoji {border-radius:0;position:relative}
#student-shell .skill-gallery .subtrack:last-child .subtrack-emoji {background-image:url('../material-art/cardboard/assets/gothic/project-map.png');background-size:330% auto;background-position:100% 91%;background-repeat:no-repeat}
#student-shell .skill-gallery .subtrack:last-child img {opacity:0;width:100%;height:100%;transform:none}

/* FEI typography: Open Sans body, Montserrat headings. */
#student-shell, #explore-tour, #explore-tour button {font-family:"Open Sans",sans-serif}
#student-shell .explore-portals .track-quote {font-family:"Open Sans",sans-serif;font-size:14px}
#student-shell .studio-continue h3 {font-family:Montserrat,sans-serif}
#student-shell .start-recommend-heading h2 {font-size:18px}

/* Homepage palette: #defde2 canvas, #fffdf9 surfaces, #17182f ink.
   Scoped to the dashboard; Artchi and standalone lesson themes keep their own colors. */
#student-shell {--dash-ink:#17182f;--dash-purple:#17182f;--dash-muted:#626574;--dash-line:#dce5db;background:#fffdf9;color:var(--dash-ink)}
#student-shell .dashboard-content {background:#fffdf9}
#student-shell .dashboard-sidebar {background:#eff8ed;border-color:#dce5db}
#student-shell .dashboard-avatar {background:#defde2}
#student-shell .dashboard-nav a {color:#535866}
#student-shell .dashboard-nav a[aria-current=page] {background:#17182f;color:#fff;box-shadow:0 5px 16px #17182f18}
#student-shell .dashboard-nav a:hover:not([aria-current=page]) {background:#defde2;color:#17182f}
#student-shell .dashboard-link,#student-shell .dashboard-button,#student-shell #hero-name,#student-shell .hero-name {color:#17182f}
#student-shell .dashboard-button {border-color:#d8dfd5;background:#fffdf9}
#student-shell .dashboard-button.primary {background:#17182f;color:#fff}
#student-shell .dashboard-special a {background:#defde2;border-color:#bfd6c0}
#student-shell .dashboard-special small,#student-shell .dashboard-small {color:#626574}
#student-shell .dashboard-tabs a[aria-current=page] {color:#17182f;border-color:#17182f}
#student-shell .dashboard-panel,#student-shell .dashboard-shape-panel {background:#fffdf9}
#student-shell .dashboard-badge-symbol {background:#e7f7f2;color:#17182f}
#student-shell .dashboard-profile-form input[type=text],#student-shell .dashboard-profile-form textarea {border-color:#d8dfd5}
#student-shell .dashboard-avatar-options input:checked+span {border-color:#17182f;background:#defde2}
#student-shell .explore-hero {background:#eff8ed;border:1px solid #dce5db;border-radius:16px;padding:16px 22px}
#student-shell .explore-invitation .dashboard-button {border:1px solid #cbdccc;background:#fffdf9;padding:9px 13px;border-radius:999px}
#student-shell .start-course-list a {background:#fff;border-color:#e1e4dc;box-shadow:0 4px 14px #17182f06;color:#17182f}
#student-shell .start-course-list a:hover {border-color:#91ac95;box-shadow:0 7px 20px #17182f12}
#student-shell .pick-copy small,#student-shell .start-recommend-heading p {color:#626574}
#student-shell .start-recommend-heading button {color:#17182f;border-color:#c7d7c5;background:#eff8ed}
#student-shell .studio-direction {position:relative;isolation:isolate;background:#e7f7f2;border:1px solid #d0e0d5;border-radius:18px 40px 18px 18px;box-shadow:0 12px 32px #23273d0d}
#student-shell .creation-direction {background:#fff8eb;border-color:#e5ddce}
#student-shell .studio-direction::before {content:'';position:absolute;inset:210px 0 0;background:url('../assets/dashboard/skill-background.jpg') center bottom/cover no-repeat;opacity:.38;pointer-events:none;z-index:-2}
#student-shell .creation-direction::before {background-image:url('../assets/dashboard/creation-background.jpg')}
#student-shell .studio-direction::after {content:'';position:absolute;inset:210px 0 0;background:#e7f7f280;pointer-events:none;z-index:-1}
#student-shell .creation-direction::after {background:#fff8eb99}
#student-shell .studio-direction .track-card,#student-shell .studio-direction .track-card:hover {background:transparent;color:#17182f}
#student-shell .studio-direction .track-card::before {display:none}
#student-shell .studio-direction .track-age-pill {background:#fffdf9cc;color:#535866;border:1px solid #ffffff}
#student-shell .studio-direction .track-quote,#student-shell .studio-direction .track-description {color:#343747;opacity:1}
#student-shell .studio-direction .explore-portal-link {display:inline-flex;align-items:center;min-height:40px;padding:0 15px;background:#fffdf9;border:1px solid #becfc1;border-radius:999px;box-shadow:0 4px 12px #17182f0b;color:#17182f}
#student-shell .creation-direction .explore-portal-link {border-color:#d9ccba}
#student-shell .studio-continue {margin:0 22px 22px;padding:18px;border:1px solid #ffffff;border-radius:14px;background:#fffdf9ed;box-shadow:0 6px 22px #23273d0c;backdrop-filter:blur(5px)}
#student-shell .studio-continue h3 {color:#17182f}
#student-shell .studio-continue h3 span {color:#626574;opacity:1}
#student-shell .studio-continue p {color:#626574}
#student-shell .studio-continue a {align-items:center;min-height:58px;gap:12px;border-color:#e3e7df;color:#17182f}
#student-shell .studio-continue a:hover {text-decoration:none}
#student-shell .studio-continue a b {display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 15px;border:1px solid #17182f;border-radius:999px;background:#17182f;color:#fff;font:600 11px 'Open Sans',sans-serif;box-shadow:0 0 0 3px #defde266,0 5px 16px #587c5d40;transition:box-shadow .2s,transform .2s,background .2s}
#student-shell .creation-direction .studio-continue a b {box-shadow:0 0 0 3px #f3e5cc88,0 5px 16px #b89a6640}
#student-shell .studio-continue a:hover b,#student-shell .studio-continue a:focus-visible b {background:#30334c;transform:translateY(-2px);box-shadow:0 0 0 4px #defde2,0 7px 22px #587c5d59}
#student-shell .creation-direction .studio-continue a:hover b,#student-shell .creation-direction .studio-continue a:focus-visible b {box-shadow:0 0 0 4px #f3e5cc,0 7px 22px #b89a6659}
#student-shell a:focus-visible,#student-shell button:focus-visible {outline:2px solid #17182f;outline-offset:4px}
#student-shell .skill-gallery .subtrack {background:#fffdf9;border-color:#dce5db;box-shadow:0 6px 18px #23273d08}
#student-shell .skill-gallery .subtrack-name,#student-shell .skill-gallery .subtrack-arrow {color:#17182f}
#student-shell .skill-gallery-description,#student-shell .skill-gallery .subtrack-meta {color:#626574}
@media(max-width:680px){#student-shell .explore-hero{padding:14px}#student-shell .studio-continue{margin:0 16px 18px;padding:14px}#student-shell .studio-continue a b{padding:0 12px;min-height:44px}#student-shell .studio-direction::before,#student-shell .studio-direction::after{top:180px}}
@media(prefers-reduced-motion:reduce){#student-shell .studio-continue a b{transition:none;transform:none}}

/* Keep the quiet homepage palette; let the original studio drawing carry the colour at the page's base. */
#student-shell .dashboard-content {background-color:#fffdf9;background-image:linear-gradient(135deg,rgba(245,243,255,.55) 0%,rgba(236,254,255,.45) 50%,rgba(254,243,247,.55) 100%),url('../assets/dashboard/dashboard-home-illustration.jpg');background-position:center bottom;background-repeat:no-repeat;background-size:100% auto}
@media(max-width:680px){#student-shell .dashboard-content {background-size:auto 430px}}

/* The course home is a quiet starting point; reserve the illustrated backdrop for the other dashboard views. */
#student-shell .dashboard-content:has(#dashboard-page-courses:not([hidden])) {background-color:#fbfaf6;background-image:linear-gradient(135deg,#fbfaf6 0%,#eef7f0 48%,#fff9ee 100%);background-position:center;background-size:100% 100%}