/* G8Code My Projects · Focused Workspace v1
   This stylesheet is scoped to #studentDashboard. The editor, Student Home,
   Firebase, grading, games, and existing project actions are unchanged. */
#studentDashboard {
  --mp-ink: #192b44;
  --mp-muted: #63758f;
  --mp-border: #e3eaf5;
  --mp-surface: #fff;
  --mp-surface-soft: #f6f9fd;
  --mp-accent: #2c5fce;
  --mp-gold: #ffd95c;
  --mp-shadow: 0 13px 35px rgba(21,45,83,.065);
  background: radial-gradient(circle at 94% 0%,rgba(171,198,250,.24),transparent 27rem),#f5f8fd !important;
  color: var(--mp-ink) !important;
  overflow-x: clip !important;
  overflow-y: auto;
  max-width: 100vw;
  overscroll-behavior-x: none;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  font-family: inherit;
}
#studentDashboard * { box-sizing: border-box; }
#studentDashboard .mp-feature-bridge,
#studentDashboard .mp-legacy-explorer-summary { display:none !important; }
#studentDashboard .mp-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: none !important;
  position: relative !important;
  top: auto !important;
  margin: 0 !important;
  min-height: 89px !important;
  padding: 15px max(24px,calc((100vw - 1250px)/2)) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--mp-border) !important;
  border-radius: 0 !important;
  background: var(--mp-surface) !important;
  color: var(--mp-ink) !important;
  box-shadow: 0 4px 25px rgba(27,44,74,.035) !important;
  overflow: visible !important;
  z-index: 11 !important;
}
#studentDashboard .mp-header .mp-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
}
#studentDashboard .mp-brand-icon {
  display: grid; place-items:center;flex:0 0 50px;
  width:50px;height:50px;border-radius:16px;
  color:#ffd457;background:#192b46;
  box-shadow: 0 8px 16px rgba(27,43,70,.14);
}
#studentDashboard .mp-brand-copy { min-width: 0; }
#studentDashboard .mp-eyebrow,
#studentDashboard .mp-library-kicker {
  margin:0 !important;color:var(--mp-accent) !important;
  font-size:10px !important;line-height:1.35 !important;
  font-weight:900 !important;letter-spacing:1.45px !important;
}
#studentDashboard .mp-eyebrow span { color:#b1bfd5; padding-inline:4px; }
#studentDashboard .mp-header h1 {
  margin:3px 0 2px !important;font-size:clamp(20px,2vw,27px) !important;
  font-weight:850 !important;letter-spacing:-.8px !important;
  line-height:1.17 !important;color:var(--mp-ink) !important;
}
#studentDashboard .mp-header #dashboardGreeting {
  display:block !important;margin:0 !important;color:var(--mp-muted) !important;
  font-size:11px !important;line-height:1.3 !important;
  white-space:normal !important;
}
#studentDashboard #dashboardGoHomeBtn.mp-home-btn {
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  gap:9px !important;flex:0 0 auto;
  min-width:0 !important;min-height:43px !important;
  margin:0 !important;padding:0 16px !important;
  border:1px solid #d6e3f7 !important;border-radius:13px !important;
  background:#eef4ff !important;color:#1b4c9d !important;
  box-shadow:none !important;font-size:12px !important;font-weight:800 !important;
  white-space:nowrap !important;
  cursor:pointer;transition:background .2s ease,transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
#studentDashboard #dashboardGoHomeBtn svg{flex:0 0 17px}
#studentDashboard .mp-header .mp-header-settings {
  display:flex !important;flex:0 0 auto !important;align-items:center !important;
  gap:7px !important;width:auto !important;min-width:0 !important;
  padding:0 !important;margin:0 !important;overflow:visible !important;
  position:static !important;grid-template-columns:none !important;
}
#studentDashboard .mp-header .mp-header-settings .mp-setting-btn {
  display:inline-flex !important;justify-content:center !important;align-items:center !important;
  min-height:43px !important;height:auto !important;max-height:none !important;
  min-width:0 !important;margin:0 !important;padding:0 13px !important;
  border-radius:13px !important;border:1px solid var(--mp-border) !important;
  background:var(--mp-surface-soft) !important;color:var(--mp-ink) !important;
  font-size:12px !important;font-weight:750 !important;white-space:nowrap !important;
  transition:background .2s ease,transform .2s ease;
}
#studentDashboard .mp-header .mp-header-settings #dashboardLogoutBtn {
  background:transparent !important;color:#ba4955 !important;
}
#studentDashboard #dashboardMobileMenuBtn { display:none !important; }
#studentDashboard .mp-main {
  display:block !important;width:min(1180px,calc(100% - 44px)) !important;
  max-width:1180px !important;margin:0 auto !important;
  padding:25px 0 65px !important;background:transparent !important;
}
#studentDashboard .mp-hero {
  position:relative !important;isolation:isolate;
  display:flex !important;align-items:center !important;justify-content:space-between !important;
  gap:26px !important;min-height:223px !important;
  margin:0 0 20px !important;padding:34px 42px !important;
  border:1px solid #2d4b77 !important;border-radius:25px !important;
  background:linear-gradient(118deg,#17263d 0%,#1c3558 55%,#24457b 100%) !important;
  color:#fff !important;box-shadow:0 16px 36px rgba(22,44,81,.12) !important;
  overflow:hidden !important;
}
#studentDashboard .mp-hero-copy {z-index:1;position:relative;min-width:0;max-width:590px}
#studentDashboard .mp-hero-tag {
  display:inline-flex;align-items:center;gap:9px;
  color:#c2d6f2;font-size:10px;letter-spacing:1.3px;font-weight:850;
}
#studentDashboard .mp-hero-live-dot {
  display:inline-block;width:7px;height:7px;flex:0 0 7px;border-radius:50%;
  background:var(--mp-gold);box-shadow:0 0 0 4px rgba(255,217,92,.12);
}
#studentDashboard .mp-hero h2 {
  margin:13px 0 10px !important;color:#fff !important;
  font-size:clamp(24px,3vw,37px) !important;
  letter-spacing:-1px !important;font-weight:900 !important;
  line-height:1.16 !important;
}
#studentDashboard .mp-hero p {
  display:block !important;margin:0 !important;color:#d5e2f5 !important;
  font-size:13px !important;line-height:1.6 !important;opacity:1 !important;
}
#studentDashboard .mp-hero-caption {
  display:flex;align-items:center;gap:8px;margin-top:16px;
  font-size:11px;font-weight:750;color:#afc8eb;
}
#studentDashboard .mp-hero-caption span {color:var(--mp-gold)}
#studentDashboard .mp-hero-actions {
  display:flex !important;flex:0 0 auto;flex-direction:column !important;
  gap:9px !important;position:relative;z-index:2;width:auto;
  align-items:stretch !important;min-width:176px;
}
#studentDashboard #newProjectBtn.dashboard-new-btn {
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  gap:8px !important;width:100% !important;min-width:0 !important;
  min-height:48px !important;height:auto !important;
  margin:0 !important;padding:10px 17px !important;
  border:0 !important;border-radius:14px !important;
  color:#192b44 !important;background:var(--mp-gold) !important;
  font-size:13px !important;font-weight:900 !important;
  box-shadow:0 9px 22px rgba(250,205,75,.15) !important;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
#studentDashboard .mp-button-plus {font-size:22px;font-weight:550;line-height:1}
#studentDashboard #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {
  display:inline-flex !important;align-items:center;justify-content:center;
  min-height:42px !important;width:100% !important;
  border:1px solid rgba(223,234,250,.4) !important;border-radius:13px !important;
  color:#fff !important;background:rgba(255,255,255,.11) !important;
  font-weight:750;font-size:12px;
}
#studentDashboard .mp-hero-art {position:absolute;right:20%;top:0;width:250px;height:100%;pointer-events:none;opacity:.65;z-index:0;display:grid;place-items:center}
#studentDashboard .mp-hero-ring {position:absolute;width:185px;height:185px;border:1px dashed rgba(207,227,255,.18);border-radius:50%;}
#studentDashboard .mp-hero-ring-two{width:247px;height:247px;opacity:.65}
#studentDashboard .mp-hero-art-icon{display:grid;place-items:center;width:112px;height:112px;border-radius:28px;transform:rotate(-10deg);font-size:37px;font-weight:900;letter-spacing:-3px;color:#23395a;background:linear-gradient(135deg,#ffd45a,#ffe88c);box-shadow:0 16px 25px rgba(0,0,0,.18);animation:mp-art-float 5.2s ease-in-out infinite}
#studentDashboard .mp-hero-art-spark{position:absolute;right:0;bottom:23px;color:#ffdc70;font-size:31px;animation:mp-spark 5s ease-in-out infinite}
#studentDashboard .mp-feedback-strip {
  display:grid !important;grid-template-columns:1fr 1fr !important;
  gap:12px !important;margin:0 0 25px !important;
  background:transparent !important;padding:0 !important;
}
#studentDashboard .mp-feedback-strip.hidden {display:none !important;}
#studentDashboard .mp-feedback-strip .dashboard-notice-card {
  display:flex !important;align-items:flex-start !important;gap:12px !important;
  padding:15px 17px !important;margin:0 !important;
  border:1px solid var(--mp-border) !important;border-radius:15px !important;
  background:var(--mp-surface) !important;color:var(--mp-ink) !important;
  box-shadow:0 6px 24px rgba(21,45,83,.035) !important;
}
#studentDashboard .mp-feedback-strip .dashboard-notice-icon{flex:0 0 34px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#eef3ff;font-size:17px}
#studentDashboard .mp-feedback-strip .dashboard-notice-card strong{display:block !important;font-size:12px !important;color:var(--mp-ink) !important;line-height:1.35 !important}
#studentDashboard .mp-feedback-strip .dashboard-notice-card p{font-size:11px !important;line-height:1.45 !important;color:var(--mp-muted) !important;margin:4px 0 0 !important}
#studentDashboard .mp-library {min-width:0;}
#studentDashboard .mp-library-heading {display:flex;align-items:end;justify-content:space-between;gap:15px;margin:6px 0 17px}
#studentDashboard .mp-library-heading h2 {display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:5px 0 6px;color:var(--mp-ink);font-size:clamp(21px,2.1vw,26px);line-height:1.2;letter-spacing:-.7px;font-weight:850}
#studentDashboard .mp-library-heading p{margin:0;color:var(--mp-muted);font-size:12px;line-height:1.5}
#studentDashboard .mp-project-count{display:inline-flex;align-items:center;justify-content:center;min-width:28px;min-height:25px;padding:2px 9px;border-radius:9px;background:#eaf1ff;color:#2756b2;font-size:12px;font-weight:900;letter-spacing:0}
#studentDashboard #mpClearFilters.mp-clear-btn:not([hidden]){display:inline-flex;align-items:center;justify-content:center;min-height:35px;padding:6px 12px;border-radius:10px;border:1px solid var(--mp-border);color:var(--mp-accent);background:var(--mp-surface);font-size:11px;font-weight:800;cursor:pointer}
#studentDashboard .mp-project-toolbar {
  display:grid !important;grid-template-columns:minmax(0,1fr) 197px !important;
  align-items:stretch !important;gap:11px !important;margin:0 0 9px !important;
  width:100% !important;max-width:none !important;
}
#studentDashboard .mp-search-box {
  display:flex !important;align-items:center !important;gap:10px !important;
  min-height:48px !important;width:100% !important;min-width:0 !important;
  margin:0 !important;padding:0 14px !important;border:1px solid var(--mp-border) !important;
  border-radius:13px !important;background:var(--mp-surface) !important;color:#8393ad !important;
  box-shadow:0 3px 13px rgba(22,42,79,.02);
}
#studentDashboard .mp-search-box input {
  min-height:44px !important;width:100% !important;min-width:0 !important;
  padding:0 !important;margin:0 !important;outline:none !important;
  border:0 !important;box-shadow:none !important;background:transparent !important;
  color:var(--mp-ink) !important;font-size:13px !important;
}
#studentDashboard .mp-search-box input::placeholder{color:#8b9ab2 !important}
#studentDashboard .mp-filter-box {
  display:flex !important;align-items:center !important;gap:10px !important;
  min-height:48px !important;margin:0 !important;padding:0 11px !important;
  border:1px solid var(--mp-border) !important;border-radius:13px !important;
  background:var(--mp-surface) !important;color:var(--mp-muted) !important;
  font-size:11px !important;font-weight:700 !important;white-space:nowrap;
}
#studentDashboard .mp-filter-box select {
  flex:1;min-width:0 !important;width:100% !important;min-height:44px !important;
  margin:0 !important;padding:0 9px !important;color:var(--mp-ink) !important;
  font-size:12px !important;font-weight:750 !important;
  border:0 !important;background:transparent !important;box-shadow:none !important;
}
#studentDashboard .mp-project-status {min-height:17px !important;margin:0 0 13px !important;padding:0 !important;color:var(--mp-muted) !important;font-size:11px !important;line-height:1.5 !important;}
#studentDashboard .mp-project-grid {
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:16px !important;margin:0 !important;padding:0 0 25px !important;
  width:100% !important;max-width:none !important;
}
#studentDashboard .mp-project-grid .student-project-card {
  display:flex !important;flex-direction:column !important;align-items:stretch !important;
  position:relative;gap:0 !important;min-width:0 !important;width:100% !important;
  min-height:268px !important;padding:20px !important;margin:0 !important;
  border:1px solid var(--mp-border) !important;border-radius:18px !important;
  background:var(--mp-surface) !important;color:var(--mp-ink) !important;
  box-shadow:var(--mp-shadow) !important;
  animation:mp-card-enter .44s cubic-bezier(.2,.8,.25,1) var(--mp-delay,0ms) both;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
#studentDashboard .mp-project-grid .project-card-top {
  display:flex !important;justify-content:space-between !important;align-items:center !important;
  min-height:43px !important;gap:8px !important;margin:0 !important;
}
#studentDashboard .mp-project-grid .project-card-icon {
  display:grid !important;place-items:center !important;flex:0 0 43px;
  width:43px !important;height:43px !important;border-radius:12px !important;
  background:#eaf0ff !important;color:#325dbe !important;font-size:17px !important;font-weight:800 !important;
}
#studentDashboard .mp-project-grid .project-card-icon.wireframe{background:#fff2dc !important;color:#9a6207 !important}
#studentDashboard .mp-project-grid .project-status-pill{display:inline-flex !important;align-items:center;justify-content:center;max-width:100%;min-height:27px;padding:5px 10px !important;font-size:10px !important;font-weight:850 !important;letter-spacing:0;white-space:normal;text-align:center}
#studentDashboard .mp-project-grid .student-project-card h3 {
  display:block !important;margin:15px 0 5px !important;color:var(--mp-ink) !important;
  font-size:clamp(15px,1.3vw,18px) !important;line-height:1.3 !important;font-weight:850 !important;letter-spacing:-.2px !important;overflow-wrap:anywhere;
}
#studentDashboard .mp-project-grid .project-card-activity{margin:0 0 10px !important;color:var(--mp-muted) !important;font-size:12px !important;line-height:1.4 !important;overflow-wrap:anywhere}
#studentDashboard .mp-project-grid .project-alert-row{margin:2px 0 8px !important;flex-wrap:wrap}
#studentDashboard .mp-project-grid .project-card-meta-row{display:flex !important;align-items:start !important;justify-content:space-between;flex-wrap:wrap;gap:6px !important;margin:4px 0 !important;padding:0 !important;min-width:0}
#studentDashboard .mp-project-grid .project-card-meta,
#studentDashboard .mp-project-grid .project-run-attempts{color:var(--mp-muted) !important;font-size:10px !important;line-height:1.45 !important;overflow-wrap:anywhere}
#studentDashboard .mp-project-grid .project-score-row{display:flex !important;align-items:center !important;justify-content:space-between !important;gap:8px !important;margin-top:auto !important;padding:13px 0 11px !important;border-bottom:1px solid var(--mp-border) !important;color:var(--mp-muted) !important;font-size:11px !important;}
#studentDashboard .mp-project-grid .project-score-value{font-size:13px !important;font-weight:900 !important;color:var(--mp-ink) !important;max-width:68%;text-align:right;overflow-wrap:anywhere}
#studentDashboard .mp-project-grid .project-card-actions{display:grid !important;grid-template-columns:minmax(0,1fr) 39px 39px !important;gap:7px !important;margin:12px 0 0 !important;align-items:stretch !important;}
#studentDashboard .mp-project-grid .project-card-actions button{display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:4px !important;min-width:0 !important;min-height:40px !important;height:auto !important;margin:0 !important;padding:8px !important;font-size:11px !important;font-weight:800 !important;border-radius:11px !important;line-height:1.2 !important;}
#studentDashboard .mp-project-grid .project-card-actions button:first-child{width:100% !important;min-width:0 !important;background:#315fcc !important;color:#fff !important;border:1px solid #315fcc !important;white-space:normal !important;}
#studentDashboard .mp-project-grid .project-card-actions button:not(:first-child){width:39px !important;border:1px solid var(--mp-border) !important;background:var(--mp-surface-soft) !important;color:var(--mp-ink) !important;font-size:15px !important;}
#studentDashboard .mp-project-grid .project-card-actions button[data-project-action="delete"]{color:#b94f5e !important}
#studentDashboard .mp-project-grid .empty-projects-card{grid-column:1/-1;width:100%;min-width:0;margin:0;padding:46px 18px;border:1px dashed #bdd0ee;border-radius:20px;background:var(--mp-surface);text-align:center;color:var(--mp-ink)}
#studentDashboard .mp-project-grid .empty-projects-card h3{color:var(--mp-ink);margin:8px 0;font-size:19px}
#studentDashboard .mp-project-grid .empty-projects-card p{color:var(--mp-muted);font-size:12px;line-height:1.65;max-width:400px;margin:7px auto 15px}
#studentDashboard .mp-project-grid .empty-projects-card .student-auth-icon{width:58px;height:58px;border-radius:17px;margin:0 auto 12px}
#studentDashboard :is(.mp-home-btn,.mp-clear-btn,.mp-setting-btn,.mp-project-grid button,.mp-project-toolbar input,.mp-project-toolbar select):focus-visible {outline:3px solid #7da8ff !important;outline-offset:3px !important;}
#studentDashboard :is(.mp-home-btn,.mp-setting-btn,.mp-project-grid button):active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine) {
  #studentDashboard #dashboardGoHomeBtn.mp-home-btn:hover{background:#e1ecff !important;border-color:#acc8ff !important;transform:translateY(-2px) !important;box-shadow:0 8px 18px rgba(25,60,110,.09) !important}
  #studentDashboard .mp-header .mp-header-settings .mp-setting-btn:hover{transform:translateY(-2px) !important;background:#eaf0ff !important}
  #studentDashboard #newProjectBtn.dashboard-new-btn:hover{transform:translateY(-3px) !important;box-shadow:0 12px 26px rgba(250,205,75,.28) !important;background:#ffe68b !important}
  #studentDashboard .mp-project-grid .student-project-card:hover{transform:translateY(-5px) !important;border-color:#b2c8f1 !important;box-shadow:0 21px 43px rgba(21,45,83,.13) !important}
  #studentDashboard .mp-project-grid .project-card-actions button:not(:first-child):hover{background:#e9f1ff !important}
}
@keyframes mp-art-float{0%,100%{transform:translateY(0) rotate(-10deg)}50%{transform:translateY(-8px) rotate(-6deg)}}
@keyframes mp-spark{0%,100%{opacity:.5;transform:scale(.92)}50%{opacity:1;transform:scale(1.12)}}
@keyframes mp-card-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes mp-page-enter{from{opacity:.65;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
#studentDashboard:not(.hidden) .mp-hero {animation:mp-page-enter .5s cubic-bezier(.2,.8,.2,1) both;}
#studentDashboard:not(.hidden) .mp-feedback-strip {animation:mp-page-enter .5s cubic-bezier(.2,.8,.2,1) .09s both;}
#studentDashboard:not(.hidden) .mp-library {animation:mp-page-enter .5s cubic-bezier(.2,.8,.2,1) .15s both;}
/* Tablet: roomy two-column project cards, horizontal workspace controls. */
@media(max-width:1090px) {
  #studentDashboard .mp-header{padding-inline:22px !important}
  #studentDashboard .mp-main{width:calc(100% - 36px) !important}
  #studentDashboard .mp-project-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  #studentDashboard .mp-hero{padding:29px 30px !important;gap:14px !important}
  #studentDashboard .mp-hero-art{right:14%;opacity:.36}
}
/* Mobile and small tablets: Home stays outside the settings menu. */
@media(max-width:820px) {
  #studentDashboard .mp-header{
    display:grid !important;grid-template-columns:minmax(0,1fr) auto auto !important;
    grid-template-rows:auto !important;align-items:center !important;column-gap:8px !important;row-gap:0 !important;
    min-height:73px !important;padding:calc(10px + env(safe-area-inset-top)) 15px 10px !important;
    border-radius:0 !important;
  }
  #studentDashboard .mp-header .mp-brand{grid-column:1 !important;grid-row:1 !important;display:flex !important;min-width:0 !important;gap:9px !important}
  #studentDashboard .mp-brand-icon{flex-basis:40px !important;width:40px !important;height:40px !important;border-radius:13px !important}
  #studentDashboard .mp-brand-icon svg{width:20px;height:20px}
  #studentDashboard .mp-header .mp-eyebrow{font-size:8px !important;letter-spacing:.8px !important;white-space:nowrap !important}
  #studentDashboard .mp-header h1{font-size:clamp(18px,3.4vw,23px) !important;letter-spacing:-.4px !important}
  #studentDashboard .mp-header #dashboardGreeting{font-size:10px !important;white-space:nowrap !important;overflow:hidden;text-overflow:ellipsis;max-width:250px}
  #studentDashboard #dashboardGoHomeBtn.mp-home-btn{grid-column:2 !important;grid-row:1 !important;min-height:41px !important;padding:0 11px !important;gap:7px !important;font-size:11px !important}
  #studentDashboard #dashboardMobileMenuBtn{
    grid-column:3 !important;grid-row:1 !important;display:flex !important;align-items:center !important;justify-content:center !important;flex-direction:column !important;
    width:42px !important;min-width:42px !important;height:41px !important;min-height:41px !important;
    padding:9px !important;margin:0 !important;gap:4px !important;justify-self:end !important;
    border-radius:12px !important;border:1px solid var(--mp-border) !important;
    background:var(--mp-surface-soft) !important;box-shadow:none !important;color:var(--mp-ink) !important;
  }
  #studentDashboard #dashboardMobileMenuBtn::before{content:none !important;display:none !important}
  #studentDashboard #dashboardMobileMenuBtn span{display:block !important;flex:0 0 2px !important;width:18px !important;height:2px !important;border-radius:3px !important;background:var(--mp-ink) !important;box-shadow:none !important;}
  /* Legacy phone controller provides a positioned, outside-click dismissible popover. */
  #studentDashboard .mp-header .mp-header-settings{display:none !important;}
  #studentDashboard .mp-header.dashboard-mobile-menu-open .mp-header-settings{
    display:grid !important;grid-template-columns:1fr !important;gap:6px !important;
    position:fixed !important;left:var(--mcs-projects-menu-left-v449,auto) !important;
    top:var(--mcs-projects-menu-top-v449,70px) !important;
    width:var(--mcs-projects-menu-width-v449,228px) !important;max-height:var(--mcs-projects-menu-max-height-v449,300px) !important;
    padding:10px !important;z-index:12501 !important;
    border:1px solid var(--mp-border) !important;border-radius:16px !important;
    background:var(--mp-surface) !important;
    box-shadow:0 17px 40px rgba(13,30,62,.18) !important;
  }
  #studentDashboard .mp-header.dashboard-mobile-menu-open .mp-header-settings .mp-setting-btn{min-height:44px !important;width:100% !important;justify-content:flex-start !important;padding:0 14px !important}
  #studentDashboard .mp-main{width:calc(100% - 28px) !important;padding:17px 0 36px !important}
  #studentDashboard .mp-hero{min-height:0 !important;gap:15px !important;padding:24px 25px !important;margin-bottom:15px !important;border-radius:20px !important;}
  #studentDashboard .mp-hero h2{font-size:clamp(23px,3.5vw,28px) !important}
  #studentDashboard .mp-hero-art{right:19%;transform:scale(.8);opacity:.24}
  #studentDashboard .mp-feedback-strip{gap:10px !important;margin-bottom:21px !important}
  #studentDashboard .mp-library-heading{margin-bottom:14px}
  #studentDashboard .mp-project-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important}
  #studentDashboard .mp-project-grid .student-project-card{padding:16px !important;min-height:253px !important;}
}
@media(max-width:600px) {
  #studentDashboard .mp-header{padding-inline:12px !important;min-height:66px !important;column-gap:6px !important}
  #studentDashboard .mp-brand-icon{flex-basis:38px !important;width:38px !important;height:38px !important}
  #studentDashboard .mp-header .mp-eyebrow{font-size:7.5px !important;letter-spacing:.3px !important}
  #studentDashboard .mp-header h1{font-size:18px !important}
  #studentDashboard .mp-header #dashboardGreeting{display:none !important}
  #studentDashboard #dashboardGoHomeBtn.mp-home-btn{width:42px !important;min-width:42px !important;min-height:42px !important;padding:0 !important;}
  #studentDashboard #dashboardGoHomeBtn.mp-home-btn span{display:none !important}
  #studentDashboard #dashboardMobileMenuBtn{width:42px !important;height:42px !important}
  #studentDashboard .mp-main{width:calc(100% - 24px) !important;padding:12px 0 32px !important;}
  #studentDashboard .mp-hero{display:flex !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;gap:17px !important;margin:0 0 12px !important;padding:20px !important;border-radius:19px !important;}
  #studentDashboard .mp-hero-tag{font-size:9px !important;letter-spacing:1.05px !important}
  #studentDashboard .mp-hero h2{font-size:clamp(22px,5.7vw,29px) !important;line-height:1.13 !important;margin:10px 0 7px !important}
  #studentDashboard .mp-hero p{display:block !important;font-size:12px !important;line-height:1.5 !important;}
  #studentDashboard .mp-hero-caption{margin-top:10px;font-size:10px}
  #studentDashboard .mp-hero-actions{width:100% !important;min-width:0 !important;max-width:none !important;flex:1 1 auto !important;}
  #studentDashboard #newProjectBtn.dashboard-new-btn{width:100% !important;min-height:45px !important}
  #studentDashboard .mp-hero-art{right:-50px;top:-16px;opacity:.13;transform:scale(.82)}
  #studentDashboard .mp-feedback-strip{grid-template-columns:minmax(0,1fr) !important;gap:8px !important;margin-bottom:20px !important}
  #studentDashboard .mp-feedback-strip .dashboard-notice-card{padding:11px 13px !important;border-radius:13px !important;gap:10px !important}
  #studentDashboard .mp-feedback-strip .dashboard-notice-icon{width:30px;height:30px;flex-basis:30px}
  #studentDashboard .mp-feedback-strip .dashboard-notice-card p{font-size:10px !important}
  #studentDashboard .mp-library-heading{align-items:start;gap:8px}
  #studentDashboard .mp-library-heading h2{font-size:21px !important}
  #studentDashboard .mp-library-heading p{font-size:11px !important}
  #studentDashboard .mp-project-toolbar{grid-template-columns:minmax(0,1fr) !important;gap:8px !important;margin-bottom:10px !important}
  #studentDashboard .mp-search-box,#studentDashboard .mp-filter-box{min-height:45px !important;border-radius:12px !important}
  #studentDashboard .mp-project-grid{grid-template-columns:minmax(0,1fr) !important;gap:10px !important}
  #studentDashboard .mp-project-grid .student-project-card{min-height:0 !important;padding:15px !important;border-radius:16px !important}
  #studentDashboard .mp-project-grid .student-project-card h3{font-size:16px !important;margin:10px 0 3px !important}
  #studentDashboard .mp-project-grid .project-card-activity{font-size:11px !important;margin:0 0 6px !important}
  #studentDashboard .mp-project-grid .project-card-meta-row{margin:3px 0 !important}
  #studentDashboard .mp-project-grid .project-score-row{padding:9px 0 !important}
  #studentDashboard .mp-project-grid .project-card-actions{margin-top:9px !important;grid-template-columns:minmax(0,1fr) 41px 41px !important}
  #studentDashboard .mp-project-grid .project-card-actions button{min-height:43px !important}
  #studentDashboard .mp-project-grid .project-card-actions button:not(:first-child){width:41px !important}
}
@media(max-width:360px) {
  #studentDashboard .mp-header .mp-brand{gap:7px !important}
  #studentDashboard .mp-brand-icon{width:35px !important;height:35px !important;flex-basis:35px !important}
  #studentDashboard .mp-header .mp-eyebrow{font-size:6.8px !important}
  #studentDashboard .mp-header h1{font-size:16px !important}
  #studentDashboard #dashboardGoHomeBtn.mp-home-btn{width:38px !important;min-width:38px !important;min-height:38px !important}
  #studentDashboard #dashboardMobileMenuBtn{width:38px !important;min-width:38px !important;height:38px !important;min-height:38px !important}
  #studentDashboard .mp-hero{padding:17px !important}
  #studentDashboard .mp-project-grid .project-card-actions{grid-template-columns:minmax(0,1fr) 39px 39px !important}
}
/* Respect all previously configured Student Theme modes, including entire-app dark mode. */
html[data-theme="dark"] #studentDashboard,
body[data-theme="dark"] #studentDashboard,
[data-theme="dark"] #studentDashboard {
  --mp-ink:#e8f2ff;--mp-muted:#a3b8d0;--mp-border:#283b54;
  --mp-surface:#101d2d;--mp-surface-soft:#17283d;--mp-accent:#91baff;
  --mp-shadow:0 13px 33px rgba(0,0,0,.13);
  background:linear-gradient(180deg,#081524,#0c192b) !important;
}
html[data-theme="dark"] #studentDashboard .mp-hero,
body[data-theme="dark"] #studentDashboard .mp-hero {border-color:#345280 !important}
html[data-theme="dark"] #studentDashboard .mp-home-btn,
body[data-theme="dark"] #studentDashboard .mp-home-btn {background:#1c3151 !important;color:#dceaff !important;border-color:#34547b !important}
html[data-theme="dark"] #studentDashboard .mp-search-box input::placeholder,
body[data-theme="dark"] #studentDashboard .mp-search-box input::placeholder {color:#a1b4ca !important}
html[data-theme="dark"] #studentDashboard .mp-project-grid .project-card-icon,
body[data-theme="dark"] #studentDashboard .mp-project-grid .project-card-icon {background:#213a60 !important;color:#b9d5ff !important}
html[data-theme="dark"] #studentDashboard .mp-project-grid .project-card-icon.wireframe,
body[data-theme="dark"] #studentDashboard .mp-project-grid .project-card-icon.wireframe {background:#473a22 !important;color:#ffe0a6 !important}
html[data-theme="dark"] #studentDashboard .mp-project-count,
body[data-theme="dark"] #studentDashboard .mp-project-count {background:#20375a;color:#b9d4ff}
@media(prefers-reduced-motion:reduce) {
  #studentDashboard *,#studentDashboard *::before,#studentDashboard *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* v1.1 responsive calibration: keep project list high, buttons compact, and tablet hero stable. */
#studentDashboard { padding:0 !important; }
#studentDashboard .mp-hero-actions {
  flex:0 0 185px !important;width:185px !important;min-width:0 !important;
  max-width:185px !important;height:auto !important;align-self:center !important;
  justify-content:center !important;
}
#studentDashboard #newProjectBtn.dashboard-new-btn {
  flex:0 0 48px !important;height:48px !important;min-height:48px !important;
  max-height:48px !important;align-self:stretch !important;
}
#studentDashboard .mp-hero-copy {flex:1 1 auto !important;max-width:590px;min-width:0 !important;}
#studentDashboard #studentProjectsGrid.mp-project-grid {grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
#studentDashboard .mp-feedback-heading {margin:25px 0 12px !important;}
#studentDashboard .mp-feedback-heading h2 {margin:4px 0 0 !important;color:var(--mp-ink) !important;font-size:17px !important;font-weight:850 !important;}
#studentDashboard .mp-feedback-strip {margin:0 0 16px !important;}
@media (max-width:1090px) {
  #studentDashboard #studentProjectsGrid.mp-project-grid {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media (min-width:601px) and (max-width:820px) {
  #studentDashboard .mp-hero {min-height:210px !important;}
  #studentDashboard .mp-hero-copy{flex:1 1 auto !important;width:auto !important;max-width:calc(100% - 210px) !important;}
  #studentDashboard .mp-hero-actions{flex:0 0 180px !important;width:180px !important;max-width:180px !important;}
  #studentDashboard .mp-hero h2{font-size:clamp(22px,3.4vw,30px) !important;}
  #studentDashboard .mp-hero-art{opacity:.16 !important;}
}
@media (max-width:600px) {
  #studentDashboard .mp-hero {min-height:0 !important;}
  #studentDashboard .mp-hero-actions {flex:0 0 auto !important;width:100% !important;min-width:0 !important;max-width:none !important;}
  #studentDashboard #newProjectBtn.dashboard-new-btn {flex:0 0 45px !important;height:45px !important;min-height:45px !important;max-height:45px !important;}
  #studentDashboard #studentProjectsGrid.mp-project-grid {grid-template-columns:minmax(0,1fr) !important;}
  #studentDashboard .mp-feedback-heading{margin:21px 0 12px !important;}
}

/* v1.2: Light / dark appearance-aware workspace hero.
   Explicitly override the parent app's high-specificity theme text rules
   (body[data-student-app-theme] #studentDashboard .dashboard-hero-card h2/p)
   which otherwise paint dark text onto a dark hero background. */
#studentDashboard .dashboard-hero-card.mp-hero {
  --mp-hero-bg: linear-gradient(115deg,#fffefb 0%,#f4f8ff 58%,#e8f1ff 100%);
  --mp-hero-border: #c9daee;
  --mp-hero-title: #172b48;
  --mp-hero-description: #445b79;
  --mp-hero-tag: #315886;
  --mp-hero-caption: #4c6384;
  --mp-hero-accent: #9a6500;
  --mp-hero-ring: rgba(50,100,175,.19);
  --mp-hero-join-bg: #ffffff;
  --mp-hero-join-border: #a9c3ea;
  --mp-hero-join-text: #214a86;
  background:var(--mp-hero-bg) !important;
  border-color:var(--mp-hero-border) !important;
  color:var(--mp-hero-title) !important;
  box-shadow:0 13px 32px rgba(34,66,113,.085) !important;
}
/* Cover original design plus custom admin-selected full-app themes. */
body #studentDashboard .dashboard-hero-card.mp-hero h2,
body[data-student-app-theme] #studentDashboard .dashboard-hero-card.mp-hero h2 {
  color:var(--mp-hero-title) !important;
  text-shadow:none !important;
  opacity:1 !important;
}
body #studentDashboard .dashboard-hero-card.mp-hero p,
body[data-student-app-theme] #studentDashboard .dashboard-hero-card.mp-hero p {
  color:var(--mp-hero-description) !important;
  text-shadow:none !important;
  opacity:1 !important;
}
#studentDashboard .dashboard-hero-card.mp-hero .mp-hero-tag {
  color:var(--mp-hero-tag) !important;
}
#studentDashboard .dashboard-hero-card.mp-hero .mp-hero-caption {
  color:var(--mp-hero-caption) !important;
}
#studentDashboard .dashboard-hero-card.mp-hero .mp-hero-caption span {
  color:var(--mp-hero-accent) !important;
}
#studentDashboard .dashboard-hero-card.mp-hero .mp-hero-ring {
  border-color:var(--mp-hero-ring) !important;
}
#studentDashboard .dashboard-hero-card.mp-hero .mp-hero-live-dot {
  background:#f0bd32 !important;
  box-shadow:0 0 0 4px rgba(240,189,50,.16) !important;
}
#studentDashboard .dashboard-hero-card.mp-hero #dashboardJoinProjectBtn.mp-join-btn:not(.hidden),
body[data-student-app-theme] #studentDashboard .dashboard-hero-card.mp-hero #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {
  background:var(--mp-hero-join-bg) !important;
  border:1px solid var(--mp-hero-join-border) !important;
  color:var(--mp-hero-join-text) !important;
}
/* Match both the normal app switch and Admin 'Entire App' appearance. */
html[data-theme="dark"] #studentDashboard .dashboard-hero-card.mp-hero,
body[data-theme="dark"] #studentDashboard .dashboard-hero-card.mp-hero,
body[data-student-app-appearance="dark"] #studentDashboard .dashboard-hero-card.mp-hero {
  --mp-hero-bg: linear-gradient(118deg,#17263d 0%,#1c3558 55%,#24457b 100%);
  --mp-hero-border: #345280;
  --mp-hero-title: #f8faff;
  --mp-hero-description: #d8e6f8;
  --mp-hero-tag: #d4e5fa;
  --mp-hero-caption: #b6d0f2;
  --mp-hero-accent: #ffdc70;
  --mp-hero-ring: rgba(207,227,255,.19);
  --mp-hero-join-bg: rgba(255,255,255,.11);
  --mp-hero-join-border: rgba(223,234,250,.46);
  --mp-hero-join-text: #fff;
  box-shadow:0 16px 36px rgba(0,0,0,.18) !important;
}
@media(prefers-reduced-motion:reduce) {
  #studentDashboard .dashboard-hero-card.mp-hero,
  #studentDashboard .dashboard-hero-card.mp-hero * {animation:none !important;transition:none !important;}
}
/* Keep mobile project actions compact even when inherited app themes set flex:1. */
@media(max-width:600px) {
  #studentDashboard .dashboard-hero-card.mp-hero .mp-hero-actions #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {
    flex:0 0 43px !important;
    height:43px !important;
    min-height:43px !important;
    max-height:43px !important;
    padding:8px 14px !important;
  }
}
/* The forced admin appearance takes precedence when it differs from a stale
   global html data-theme (for example, after switching student sessions). */
body[data-student-app-appearance="light"] #studentDashboard .dashboard-hero-card.mp-hero {
  --mp-hero-bg:linear-gradient(115deg,#fffefb 0%,#f4f8ff 58%,#e8f1ff 100%);
  --mp-hero-border:#c9daee;
  --mp-hero-title:#172b48;
  --mp-hero-description:#445b79;
  --mp-hero-tag:#315886;
  --mp-hero-caption:#4c6384;
  --mp-hero-accent:#9a6500;
  --mp-hero-ring:rgba(50,100,175,.19);
  --mp-hero-join-bg:#ffffff;
  --mp-hero-join-border:#a9c3ea;
  --mp-hero-join-text:#214a86;
}
/* In entire-app dark themes the legacy stylesheet deliberately clears the
   hero background-image. Restore a contrasting dark gradient only in My Projects. */
body[data-student-app-theme]:not([data-student-app-theme="original"])[data-student-app-appearance="dark"]
#studentDashboard .dashboard-hero-card.mp-hero {
  background:var(--mp-hero-bg) !important;
  background-image:var(--mp-hero-bg) !important;
  color:var(--mp-hero-title) !important;
  border-color:var(--mp-hero-border) !important;
}
body[data-student-app-theme]:not([data-student-app-theme="original"])[data-student-app-appearance="dark"]
#studentDashboard .dashboard-hero-card.mp-hero h2 {
  color:var(--mp-hero-title) !important;
}
body[data-student-app-theme]:not([data-student-app-theme="original"])[data-student-app-appearance="dark"]
#studentDashboard .dashboard-hero-card.mp-hero p {
  color:var(--mp-hero-description) !important;
}


/* v2 compact creative workspace: preserve theme-aware contrast and all actions. */
#studentDashboard .dashboard-hero-card.mp-hero {
  min-height:148px !important;
  margin-bottom:14px !important;
  padding:18px 28px !important;
  gap:16px !important;
  border-radius:17px !important;
  box-shadow:0 8px 23px rgba(34,66,113,.075) !important;
}
#studentDashboard .mp-main {padding-top:18px !important}
#studentDashboard .mp-hero-copy {max-width:58% !important}
#studentDashboard .mp-hero-tag {font-size:9px !important;letter-spacing:1.15px !important;gap:7px !important}
#studentDashboard .mp-hero h2 {
  font-size:clamp(21px,2.05vw,26px) !important;
  margin:7px 0 5px !important;
  line-height:1.19 !important;
  letter-spacing:-.7px !important;
}
#studentDashboard .mp-hero p {font-size:12px !important;line-height:1.45 !important}
#studentDashboard .mp-hero-caption {margin-top:9px !important;font-size:10px !important;gap:5px !important}
#studentDashboard .mp-hero-actions {
  flex:0 0 164px !important;
  width:164px !important;
  min-width:0 !important;
  max-width:164px !important;
  gap:6px !important;
}
#studentDashboard #newProjectBtn.dashboard-new-btn {
  height:38px !important;min-height:38px !important;max-height:38px !important;
  flex:0 0 38px !important;
  font-size:11px !important;
  border-radius:10px !important;
  padding:7px 12px !important;
}
#studentDashboard .mp-button-plus {font-size:18px !important}
#studentDashboard .dashboard-hero-card.mp-hero #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {
  height:38px !important;min-height:38px !important;max-height:38px !important;
  flex:0 0 38px !important;
  border-radius:10px !important;
  padding:7px 12px !important;
  font-size:11px !important;
}
#studentDashboard .mp-hero-art {width:160px !important;right:17% !important;opacity:.47 !important}
#studentDashboard .mp-hero-ring {width:124px !important;height:124px !important}
#studentDashboard .mp-hero-ring-two {width:160px !important;height:160px !important}
#studentDashboard .mp-hero-art-icon {
  width:77px !important;height:77px !important;border-radius:18px !important;
  font-size:27px !important;letter-spacing:-2px !important;
  box-shadow:0 9px 19px rgba(0,0,0,.11) !important;
}
#studentDashboard .mp-hero-art-spark {font-size:22px !important;bottom:13px !important;right:8px !important}
@media (max-width:1090px) {
  #studentDashboard .dashboard-hero-card.mp-hero {padding:18px 22px !important;gap:12px !important}
  #studentDashboard .mp-hero-art {right:15% !important;opacity:.23 !important}
}
@media (min-width:601px) and (max-width:820px) {
  #studentDashboard .dashboard-hero-card.mp-hero {min-height:152px !important;padding:18px 21px !important}
  #studentDashboard .mp-hero-copy {max-width:calc(100% - 177px) !important}
  #studentDashboard .mp-hero-actions {flex:0 0 156px !important;width:156px !important;max-width:156px !important}
  #studentDashboard .mp-hero h2 {font-size:21px !important}
  #studentDashboard .mp-hero-art {opacity:.10 !important}
}
@media (max-width:600px) {
  #studentDashboard .mp-main {padding-top:12px !important}
  #studentDashboard .dashboard-hero-card.mp-hero {
    min-height:0 !important;
    padding:16px !important;
    gap:12px !important;
    margin-bottom:12px !important;
    border-radius:16px !important;
  }
  #studentDashboard .mp-hero-copy {max-width:100% !important}
  #studentDashboard .mp-hero h2 {font-size:clamp(20px,5.45vw,23px) !important;margin:7px 0 5px !important}
  #studentDashboard .mp-hero p {font-size:11px !important;line-height:1.4 !important}
  #studentDashboard .mp-hero-caption {display:none !important}
  #studentDashboard .mp-hero-actions {
    flex:0 0 auto !important;
    flex-direction:row !important;
    align-items:stretch !important;
    width:100% !important;max-width:none !important;
    gap:8px !important;
    justify-content:flex-start !important;
  }
  #studentDashboard #newProjectBtn.dashboard-new-btn,
  #studentDashboard .dashboard-hero-card.mp-hero #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {
    flex:1 1 0 !important;
    min-width:0 !important;
    width:auto !important;
    height:39px !important;min-height:39px !important;max-height:39px !important;
    font-size:11px !important;
  }
  #studentDashboard .mp-hero-art {right:-35px !important;opacity:.09 !important;transform:scale(.75) !important}
}
@media (max-width:360px) {
  #studentDashboard .dashboard-hero-card.mp-hero {padding:14px !important}
  #studentDashboard .mp-hero h2 {font-size:20px !important}
  #studentDashboard #newProjectBtn.dashboard-new-btn,
  #studentDashboard .dashboard-hero-card.mp-hero #dashboardJoinProjectBtn.mp-join-btn:not(.hidden) {font-size:10px !important;padding:7px !important}
}
/* The original mobile controls add fixed flex-basis and order; reset both so
   New and Join remain equal-width touch targets, without overlap. */
@media(max-width:600px){
 #studentDashboard .dashboard-hero-card.mp-hero .mp-hero-actions #newProjectBtn.dashboard-new-btn,
 #studentDashboard .dashboard-hero-card.mp-hero .mp-hero-actions #dashboardJoinProjectBtn.mp-join-btn:not(.hidden){
   flex:1 1 0 !important;
   width:0 !important;
   min-width:0 !important;
   max-width:none !important;
   height:40px !important;
   min-height:40px !important;
   max-height:40px !important;
   transform:none !important;
   padding:8px 8px !important;
 }
 #studentDashboard .dashboard-hero-card.mp-hero .mp-hero-actions #newProjectBtn.dashboard-new-btn{order:0 !important}
 #studentDashboard .dashboard-hero-card.mp-hero .mp-hero-actions #dashboardJoinProjectBtn.mp-join-btn:not(.hidden){order:1 !important}
}
