/* SILABUS — PLAYFUL TECH EDITORIAL SYSTEM
   A complete art-direction pass: tactile paper, cyan, electric blue, acid lime.
   Application behavior and semantic IDs remain owned by index.html/app.js/gdsync.js. */
:root{
  color-scheme:light;
  --ds-canvas:#f3efe3;--ds-paper:#fffdf5;--ds-surface:#fffef9;--ds-raised:#ffffff;--ds-muted:#e8e2d3;
  --ds-ink:#17191b;--ds-muted-ink:#5f625f;--ds-line:#c9c5b8;--ds-line-soft:#e5e0d4;
  --ds-blue:#155eef;--ds-blue-deep:#0a3db9;--ds-cyan:#25c8cf;--ds-lime:#d8ff3e;--ds-pink:#ff78bb;
  --ds-orange:#ff7043;--ds-green:#a7d85a;--ds-red:#c73737;--ds-sidebar:#fbf8ef;--ds-sidebar-ink:#17191b;
  --ds-shadow:4px 4px 0 #17191b;--ds-shadow-small:2px 2px 0 rgba(23,25,27,.18);
  --ds-shadow-float:0 18px 45px rgba(23,25,27,.17);--ds-r-sm:8px;--ds-r-md:13px;--ds-r-lg:20px;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --ds-canvas:#111a25;--ds-paper:#172433;--ds-surface:#1b2a3a;--ds-raised:#223346;--ds-muted:#293b4e;
  --ds-ink:#f7f3e8;--ds-muted-ink:#bac6d1;--ds-line:#43566a;--ds-line-soft:#2e4154;
  --ds-blue:#6ea2ff;--ds-blue-deep:#3979f6;--ds-cyan:#39e0e0;--ds-lime:#d8ff3e;--ds-pink:#ff91c7;
  --ds-orange:#ff936e;--ds-green:#b5e76d;--ds-red:#ff7b7b;--ds-sidebar:#0c1420;--ds-sidebar-ink:#f7f3e8;
  --ds-shadow:4px 4px 0 #050b12;--ds-shadow-small:2px 2px 0 rgba(0,0,0,.28);
  --ds-shadow-float:0 18px 45px rgba(0,0,0,.32);
}
*{scrollbar-color:var(--ds-line) transparent}
html{background:var(--ds-canvas);scroll-padding-top:86px}
body{
  background-color:var(--ds-canvas);
  background-image:radial-gradient(rgba(23,25,27,.075) .65px,transparent .65px);
  background-size:7px 7px;color:var(--ds-ink);font-family:'DM Sans',system-ui,sans-serif;font-size:14px;line-height:1.55
}
html[data-theme="dark"] body{background-image:radial-gradient(rgba(255,255,255,.035) .65px,transparent .65px)}
::selection{background:var(--ds-lime);color:#17191b}
h1,h2,h3,h4,.page-header h1,.workspace-intro h1{font-family:'Bricolage Grotesque','DM Sans',sans-serif;letter-spacing:-.055em}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--ds-cyan);outline-offset:3px}
button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}
.app-shell{min-height:100vh;background:transparent}
.topbar{
  height:70px;padding:0 25px;gap:15px;background:var(--ds-paper);color:var(--ds-ink);
  border:0;border-bottom:2px solid var(--ds-ink);box-shadow:0 3px 0 rgba(23,25,27,.04);z-index:110
}
.topbar-brand{gap:11px;min-width:0}
.sidebar-toggle{
  display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border:1.5px solid var(--ds-ink);
  border-radius:10px 5px 10px 5px;background:var(--ds-paper);color:var(--ds-ink);box-shadow:2px 2px 0 var(--ds-ink);
  transition:transform .18s ease,background .18s ease
}
.sidebar-toggle:hover{background:var(--ds-lime);transform:rotate(-3deg)}
.topbar-brand .brand-logo-btn{
  display:grid;place-items:center;width:39px;height:39px;flex-shrink:0;background:var(--ds-cyan);color:#17191b;
  border:2px solid var(--ds-ink);border-radius:12px 5px 12px 5px;box-shadow:3px 3px 0 var(--ds-ink);
  font:800 18px 'Bricolage Grotesque',sans-serif;transform:rotate(-3deg);overflow:hidden
}
.topbar-brand .brand-title-input{width:94px;color:var(--ds-ink);font:800 20px 'Bricolage Grotesque',sans-serif;letter-spacing:-.07em}
.topbar-brand .course-title-input{
  width:min(38vw,460px);min-width:100px;max-width:460px;padding:8px 0 8px 16px;border-left:2px solid var(--ds-line);
  border-radius:0;color:var(--ds-muted-ink);font-size:12px
}
.topbar-actions{gap:9px}
.topbar-actions>button{
  min-height:39px;padding:8px 12px;border:1.5px solid var(--ds-ink);border-radius:9px;
  background:var(--ds-paper);color:var(--ds-ink);transition:transform .18s ease,box-shadow .18s ease,background .18s ease
}
.topbar-actions>button:hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ds-ink)}
#theme-toggle-btn:hover{background:var(--ds-cyan)}
#gdsync-topbar-btn{background:var(--ds-lime);color:#17191b;font-weight:850;box-shadow:2px 2px 0 var(--ds-ink)}
.gdsync-topbar-badge{background:var(--ds-blue)}
.sidebar{
  top:70px;height:calc(100vh - 70px);width:250px;background:var(--ds-sidebar);color:var(--ds-sidebar-ink);
  border:0;border-right:2px solid var(--ds-ink);box-shadow:none;z-index:100
}
.sidebar-nav{padding:22px 13px 14px}
.nav-section{margin-bottom:22px}
.nav-section-label{padding:0 12px;margin-bottom:9px;color:var(--ds-muted-ink);font-size:9px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}
html[data-theme="dark"] .nav-section-label{color:#90a4b9}
.nav-item{
  position:relative;min-height:43px;padding:10px 12px;gap:12px;border:1px solid transparent;border-radius:9px;
  color:var(--ds-muted-ink);font-size:12px;font-weight:650;
  transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease
}
html[data-theme="dark"] .nav-item{color:#c3d0dc}
.nav-item .nav-icon{width:20px;color:var(--ds-blue);font-size:16px}
html[data-theme="dark"] .nav-item .nav-icon{color:var(--ds-cyan)}
.nav-item:hover{transform:translateX(3px);background:color-mix(in srgb,var(--ds-cyan) 17%,var(--ds-sidebar));color:var(--ds-ink)}
html[data-theme="dark"] .nav-item:hover{color:#fff;background:#1a2d40}
.nav-item.active{background:var(--ds-lime);color:#17191b;border-color:var(--ds-ink);box-shadow:2px 2px 0 var(--ds-ink);font-weight:850}
.nav-item.active::before{content:none}.nav-item.active .nav-icon{color:var(--ds-blue-deep)}
.nav-item.nav-sub-item{padding-left:34px}.sidebar.collapsed .nav-item.nav-sub-item{padding-left:12px}
.sidebar-footer{border-top:1px solid var(--ds-line);padding:12px}
html[data-theme="dark"] .sidebar-footer{border-top-color:var(--ds-line)}
.sidebar-toggle{flex-shrink:0}.sidebar-backdrop{z-index:90}
.main-content{
  margin-top:70px;margin-left:250px;padding:30px clamp(20px,3vw,44px) 54px;width:calc(100% - 250px);
  max-width:calc(100% - 250px);min-width:0;min-height:calc(100vh - 70px);
  transition:margin-left .2s ease,width .2s ease,padding .2s ease
}
.sidebar.collapsed~.main-content{margin-left:68px;width:calc(100% - 68px);max-width:calc(100% - 68px)}
#dashboard-content{display:flex;flex-direction:column;gap:27px}
.workspace-intro{
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  min-height:238px;padding:30px 32px;background:var(--ds-paper);color:var(--ds-ink);
  border:2px solid var(--ds-ink);border-radius:var(--ds-r-lg);box-shadow:var(--ds-shadow)
}
.workspace-intro::before{
  content:"";position:absolute;z-index:-2;inset:0;
  background:linear-gradient(180deg,transparent 0 35%,var(--ds-lime) 35% 57%,transparent 57%),
    linear-gradient(90deg,var(--ds-cyan) 0 100%);
  background-size:100% 100%,100% 9px;background-position:center,center 32%;background-repeat:no-repeat;
  opacity:.95
}
.workspace-intro::after{
  content:"MAKE\\A LEARN\\A REPEAT.";white-space:pre;position:absolute;z-index:-1;right:3%;top:2%;
  color:color-mix(in srgb,var(--ds-blue) 14%,transparent);font:900 clamp(54px,8vw,118px)/.77 'Bricolage Grotesque',sans-serif;
  letter-spacing:-.09em;transform:translate3d(var(--hero-drift-x,0px),var(--hero-drift-y,0px),0) rotate(-7deg);pointer-events:none
}
.workspace-intro-copy{min-width:0;max-width:700px}
.workspace-eyebrow,.workspace-section-kicker{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:9px;line-height:1.3;font-weight:900;letter-spacing:.17em}
.workspace-eyebrow{display:inline-flex;padding:6px 9px;background:var(--ds-ink);color:var(--ds-lime);border-radius:3px;transform:rotate(-1deg)}
.workspace-eyebrow-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ds-cyan);box-shadow:0 0 0 3px rgba(37,200,207,.18)}
.workspace-intro .page-header{margin:0;padding:0;border:0}
.workspace-intro .page-header h1{
  max-width:720px;margin:0;color:var(--ds-ink);font-size:clamp(46px,5.7vw,78px);font-weight:900;
  line-height:.88;letter-spacing:-.085em;text-wrap:balance;text-shadow:2px 2px 0 var(--ds-paper)
}
.workspace-intro .page-header p{max-width:500px;margin:16px 0 0;color:var(--ds-ink);font-size:13px;line-height:1.6;font-weight:650}
.workspace-intro-actions{display:flex;align-items:flex-end;gap:12px;flex-shrink:0;flex-direction:column}
.workspace-local-label{
  display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1.5px solid var(--ds-ink);
  border-radius:4px;background:var(--ds-paper);color:var(--ds-ink);font-size:10px;font-weight:750;white-space:nowrap;
  box-shadow:2px 2px 0 var(--ds-ink);transform:rotate(2deg)
}
.workspace-local-label i{color:var(--ds-blue)}
.workspace-add-btn{
  min-height:46px;padding:11px 16px;gap:9px;border:2px solid var(--ds-ink);border-radius:9px;
  background:var(--ds-blue);color:white;font-size:12px;font-weight:850;box-shadow:4px 4px 0 var(--ds-ink);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease
}
.workspace-add-btn:hover{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ds-ink);background:var(--ds-blue-deep);color:white}
.workspace-composer,.workspace-schedule{
  margin:0!important;border:1.5px solid var(--ds-ink);border-radius:var(--ds-r-md);background:var(--ds-paper);
  box-shadow:3px 3px 0 rgba(23,25,27,.12);overflow:hidden
}
.workspace-composer>summary,.workspace-schedule>summary{
  display:flex;align-items:center;gap:12px;min-height:72px;padding:13px 18px;background:var(--ds-paper);
  color:var(--ds-ink);list-style:none;cursor:pointer
}
.workspace-composer>summary::-webkit-details-marker,.workspace-schedule>summary::-webkit-details-marker{display:none}
.workspace-summary-icon{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;
  border:1.5px solid var(--ds-ink);border-radius:11px;background:var(--ds-cyan);color:#17191b;font-size:17px;
  box-shadow:2px 2px 0 var(--ds-ink);transform:rotate(-3deg)
}
.workspace-summary-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}
.workspace-summary-copy strong{font-size:13px;font-weight:850}
.workspace-summary-copy small{color:var(--ds-muted-ink);font-size:11px;font-weight:450}
.workspace-summary-chevron{margin-left:auto;color:var(--ds-blue);transition:transform .22s ease}
.workspace-composer[open]>summary,.workspace-schedule[open]>summary{border-bottom:1.5px solid var(--ds-ink)}
.workspace-composer[open]>summary .workspace-summary-chevron,.workspace-schedule[open]>summary .workspace-summary-chevron{transform:rotate(180deg)}
.workspace-composer .accordion-content,.workspace-schedule .accordion-content{padding:23px}
.workspace-composer #syllabus-form{gap:18px}.workspace-composer .form-group{min-width:0;gap:7px}
.workspace-composer .form-label{color:var(--ds-ink);font-size:11px;font-weight:850}
.workspace-composer .form-input,.workspace-composer .form-select,.workspace-composer .form-textarea{
  min-height:43px;border:1.5px solid var(--ds-line);border-radius:9px;background:var(--ds-surface);color:var(--ds-ink);
  box-shadow:none;font-size:13px;transition:border-color .16s ease,box-shadow .16s ease
}
.workspace-composer .form-input:focus,.workspace-composer .form-select:focus,.workspace-composer .form-textarea:focus{
  border-color:var(--ds-blue);box-shadow:3px 3px 0 color-mix(in srgb,var(--ds-blue) 20%,transparent)
}
.workspace-composer #notes-container{min-height:150px}
.workspace-metrics-section{display:flex;flex-direction:column;gap:13px}
.workspace-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 2px}
.workspace-section-heading h2{margin:0;color:var(--ds-ink);font-size:clamp(22px,2vw,29px);font-weight:900;letter-spacing:-.065em}
.workspace-section-heading p{margin:5px 0 0;color:var(--ds-muted-ink);font-size:12px}
.workspace-section-kicker{margin-bottom:5px;color:var(--ds-blue);font-size:9px}
html[data-theme="dark"] .workspace-section-kicker{color:var(--ds-cyan)}
#stats-summary.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;overflow:visible;border:0;border-radius:0;background:transparent}
#stats-summary .kpi-card{
  position:relative;isolation:isolate;min-width:0;overflow:hidden;padding:20px 18px!important;
  border:1.5px solid var(--ds-ink)!important;border-radius:14px!important;background:var(--ds-paper)!important;
  box-shadow:3px 3px 0 var(--ds-ink)!important;transition:transform .2s ease,box-shadow .2s ease!important
}
#stats-summary .kpi-card::after{
  content:"";position:absolute;z-index:-1;width:90px;height:90px;right:-30px;bottom:-42px;border-radius:50%;
  background:var(--ds-cyan);opacity:.34
}
#stats-summary .kpi-card:nth-child(2){background:var(--ds-lime)!important}
#stats-summary .kpi-card:nth-child(3){background:#cceff0!important}
#stats-summary .kpi-card:nth-child(4){background:#ffd5e9!important}
#stats-summary .kpi-card:nth-child(5){background:#dbe7ff!important}
#stats-summary .kpi-card:nth-child(2)::after{background:var(--ds-blue)}
#stats-summary .kpi-card:hover{transform:translate(-2px,-3px)!important;box-shadow:5px 6px 0 var(--ds-ink)!important}
#stats-summary .kpi-icon{display:grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border:1.5px solid var(--ds-ink);border-radius:10px;background:var(--ds-paper);color:var(--ds-blue);box-shadow:2px 2px 0 var(--ds-ink)}
#stats-summary .kpi-value{color:var(--ds-ink);font:900 clamp(28px,3vw,39px)/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.07em}
#stats-summary .kpi-label{margin-top:7px;color:var(--ds-ink);font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
#stats-summary .kpi-trend{font-size:10px;font-weight:800}
html[data-theme="dark"] #stats-summary .kpi-card{background:var(--ds-paper)!important}
html[data-theme="dark"] #stats-summary .kpi-card:nth-child(2){background:#354c20!important}
html[data-theme="dark"] #stats-summary .kpi-card:nth-child(3){background:#183e49!important}
html[data-theme="dark"] #stats-summary .kpi-card:nth-child(4){background:#4c2c43!important}
html[data-theme="dark"] #stats-summary .kpi-card:nth-child(5){background:#233d67!important}
.materials-workspace{
  min-width:0;padding:25px;border:1.5px solid var(--ds-ink);border-radius:var(--ds-r-lg);background:var(--ds-paper);
  box-shadow:4px 4px 0 var(--ds-ink)
}
.materials-heading-row{margin-bottom:20px}
.materials-heading-mark{
  display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1.5px solid var(--ds-ink);
  border-radius:13px;background:var(--ds-lime);color:#17191b;font-size:20px;box-shadow:3px 3px 0 var(--ds-ink);transform:rotate(4deg)
}
.materials-toolbar{
  display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:0 0 17px;margin:0 0 16px;
  border:0;border-bottom:1.5px dashed var(--ds-line);background:transparent
}
.materials-toolbar .search-box{flex:1 1 260px!important;max-width:420px!important;min-width:180px}
.materials-toolbar .search-box input{
  min-height:43px;border:1.5px solid var(--ds-ink);border-radius:9px;background:var(--ds-surface);color:var(--ds-ink);font-size:12px
}
.materials-toolbar .search-icon{color:var(--ds-blue)}.materials-toolbar .toolbar-divider{display:none}
.materials-toolbar .toolbar-group{gap:7px}
.materials-toolbar .form-select{min-height:41px;border:1.5px solid var(--ds-line);border-radius:9px;background-color:var(--ds-surface);color:var(--ds-ink);font-size:12px!important}
.materials-toolbar .btn{min-height:39px;padding:8px 11px;border-radius:9px;font-size:11px;font-weight:800}
.materials-toolbar .btn-primary,.materials-toolbar .btn-info{background:var(--ds-blue);border-color:var(--ds-ink);color:white;box-shadow:2px 2px 0 var(--ds-ink)}
.materials-toolbar .secondary-actions{margin-left:auto}.materials-toolbar .secondary-actions .btn{width:39px;min-width:39px;height:39px;border:1.5px solid var(--ds-ink)}
.data-table-wrapper{
  position:relative;isolation:isolate;max-width:100%;overflow:auto;border:1.5px solid var(--ds-ink);border-radius:11px;
  background:var(--ds-surface);box-shadow:3px 3px 0 rgba(23,25,27,.12);scrollbar-width:thin;overscroll-behavior-x:contain
}
.data-table{width:100%;min-width:1060px;border-collapse:separate;border-spacing:0;color:var(--ds-ink);background:var(--ds-surface)}
.data-table thead th{
  position:sticky;top:0;z-index:2;padding:13px;background:var(--ds-ink);color:#f7f3e8;border-bottom:1px solid var(--ds-ink);
  font-size:9px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap
}
.data-table tbody td{padding:14px 13px;background:var(--ds-surface);border-bottom:1px solid var(--ds-line-soft);color:var(--ds-ink);font-size:12px;line-height:1.5}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table tbody tr:hover td{background:color-mix(in srgb,var(--ds-cyan) 14%,var(--ds-surface))}
.data-table tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--ds-muted) 28%,var(--ds-surface))}
.data-table tbody tr:nth-child(even):hover td{background:color-mix(in srgb,var(--ds-cyan) 14%,var(--ds-surface))}
.data-table thead th:last-child,.data-table tbody td:last-child{
  position:sticky;right:0;z-index:4;width:140px;min-width:140px;max-width:140px;background:var(--ds-surface);
  box-shadow:-8px 0 12px rgba(23,25,27,.07)
}
.data-table thead th:last-child{z-index:5;background:var(--ds-ink)}
.data-table tbody tr:hover td:last-child{background:color-mix(in srgb,var(--ds-cyan) 14%,var(--ds-surface))}
.data-table tbody td:last-child>div{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:4px;min-width:max-content}
.data-table tbody td:last-child button{flex:0 0 34px;width:34px;min-width:34px;min-height:34px;border:1px solid var(--ds-line);border-radius:8px;background:var(--ds-paper);color:var(--ds-ink)}
.status-badge{padding:4px 8px;border:1px solid currentColor;border-radius:999px;font-size:10px;font-weight:850}
.progress-track{height:6px;background:var(--ds-muted);border-radius:99px}.progress-fill{background:var(--ds-blue);border-radius:99px}
.grade-badge{border-radius:7px}.data-cards-view{gap:13px}
.data-cards-view .data-card{
  position:relative;border:1.5px solid var(--ds-ink)!important;border-radius:13px!important;background:var(--ds-surface)!important;
  box-shadow:3px 3px 0 var(--ds-ink)!important;transition:transform .2s ease,box-shadow .2s ease!important
}
.data-cards-view .data-card:nth-child(3n+1){border-top:4px solid var(--ds-cyan)!important}
.data-cards-view .data-card:nth-child(3n+2){border-top:4px solid var(--ds-lime)!important}
.data-cards-view .data-card:nth-child(3n){border-top:4px solid var(--ds-pink)!important}
.data-cards-view .data-card:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ds-ink)!important}
.data-card-title{color:var(--ds-ink);font-weight:850}.data-card-code{border:1px solid var(--ds-line);background:var(--ds-muted);color:var(--ds-ink)}
.data-card-meta{color:var(--ds-muted-ink)}.data-card-actions{border-top:1px dashed var(--ds-line)}
.workspace-endnote{display:flex;align-items:center;justify-content:center;gap:12px;margin:22px 0 0;color:var(--ds-muted-ink);font-size:10px}
.workspace-endnote-line{width:32px;height:2px;background:var(--ds-blue)}
.workspace-schedule{box-shadow:3px 3px 0 rgba(23,25,27,.12)}.workspace-schedule>summary{min-height:72px}
#gantt-toolbar{border-bottom-color:var(--ds-line)!important}
.gantt-container,.gantt-labels-panel,.gantt-timeline-panel{border-color:var(--ds-line)!important;background:var(--ds-surface)!important;color:var(--ds-ink)}
.gantt-labels-header,.gantt-header{background:var(--ds-ink)!important;color:#f7f3e8!important;border-color:var(--ds-ink)!important}
.gantt-labels-body{background:var(--ds-surface)!important}
.gantt-task-row,.gantt-row{border-color:var(--ds-line-soft)!important}
#schedule-calendar-view{color:var(--ds-ink)}#cal-month-year{font-family:'Bricolage Grotesque',sans-serif}
.card,.accordion{border-color:var(--ds-line);background:var(--ds-paper);box-shadow:2px 2px 0 rgba(23,25,27,.08)}
.card-header{border-bottom-color:var(--ds-line-soft)}
.btn{min-height:38px;border-radius:9px;font-weight:750;transition:transform .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.btn:active{transform:translate(1px,1px)}
.btn-primary{background:var(--ds-blue);border-color:var(--ds-ink);color:#fff;box-shadow:2px 2px 0 var(--ds-ink)}
.btn-primary:hover{background:var(--ds-blue-deep);border-color:var(--ds-ink);color:#fff;transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ds-ink)}
.btn-secondary{background:var(--ds-paper);border-color:var(--ds-ink);color:var(--ds-ink)}
.btn-secondary:hover{background:var(--ds-lime);border-color:var(--ds-ink);color:var(--ds-ink)}
.btn-info{background:var(--ds-lime);border-color:var(--ds-ink);color:var(--ds-ink)}
.btn-danger{background:#c73737;border-color:var(--ds-ink);color:white}
.form-input,.form-select,.form-textarea{border:1.5px solid var(--ds-line);border-radius:9px;background:var(--ds-surface);color:var(--ds-ink)}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--ds-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--ds-blue) 15%,transparent);outline:none}
.modal-overlay{background:rgba(6,12,24,.72);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);z-index:12000}
.modal-panel,.modal-content,.detail-modal-panel{border:1.5px solid var(--ds-ink);border-radius:18px;box-shadow:9px 9px 0 rgba(0,0,0,.24)}
.modal-header,.detail-modal-header{border-bottom-color:var(--ds-line-soft)}
.modal-footer,.detail-modal-footer{border-top-color:var(--ds-line-soft);background:var(--ds-paper)}
.detail-card{border:1.5px solid var(--ds-line);border-radius:12px;background:var(--ds-surface)}
.detail-card-header{border-bottom-color:var(--ds-line-soft)}.detail-card-icon{border:1px solid var(--ds-ink);border-radius:9px}
#personal-space-content{padding-top:30px}
#personal-space-content .ps-container{max-width:880px;margin:0 auto}
#personal-space-content .threads-profile,#personal-space-content .ps-composer-trigger,#personal-space-content .ps-search-bar{border-color:var(--ds-line)}
#personal-space-content .ps-composer-trigger,#personal-space-content .ps-search-bar{background:var(--ds-paper);border-radius:14px}
#personal-space-content .threads-feed>*{border:1.5px solid var(--ds-ink);border-radius:15px;box-shadow:3px 3px 0 rgba(23,25,27,.1)}
.mobile-bottom-nav{border-top:2px solid var(--ds-ink);background:var(--ds-paper)}
.mobile-nav-item{transition:color .18s ease,background .18s ease}.mobile-nav-item.active{color:var(--ds-blue)}
#auto-lock-progress{z-index:100000}
#sticky-note-fab{
  z-index:700!important;right:22px;top:auto;bottom:88px;transform:none;
  border:1.5px solid var(--ds-ink);border-radius:11px 5px 11px 5px;box-shadow:3px 3px 0 var(--ds-ink)
}
#sticky-note-fab:hover{transform:translateY(-3px) rotate(-3deg);box-shadow:5px 5px 0 var(--ds-ink)}
#sticky-note-fab.hidden{transform:scale(.7)}
#sticky-note-panel{
  z-index:701!important;right:22px;top:auto;bottom:150px;transform:translateY(12px) scale(.98);
  width:min(350px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:min(62vh,520px);
  border:1.5px solid var(--ds-ink);border-radius:14px 5px 14px 5px;box-shadow:6px 6px 0 var(--ds-ink)
}
#sticky-note-panel.active{transform:translateY(0) scale(1)!important}
#sticky-note-panel .sticky-note-header{background:rgba(255,255,255,.55);border-bottom:1px solid rgba(0,0,0,.12)}
#sticky-note-panel .sticky-note-textarea{font:500 13px/1.8 'DM Sans',sans-serif}
#sticky-note-panel textarea{max-width:100%;min-height:160px}
#sticky-note-fab,#sticky-note-panel{isolation:isolate}
.fab-container{z-index:650}
#floating-help-btn{border:1.5px solid var(--ds-ink);box-shadow:3px 3px 0 var(--ds-ink)}
.hidden[hidden]{display:none!important}
@media(hover:hover) and (pointer:fine){
  .materials-heading-mark{transition:transform .22s cubic-bezier(.2,.8,.2,1)}
  .materials-heading-row:hover .materials-heading-mark{transform:rotate(-5deg) translateY(-2px)}
  .workspace-summary-icon{transition:transform .2s ease}
  .workspace-composer>summary:hover .workspace-summary-icon,.workspace-schedule>summary:hover .workspace-summary-icon{transform:rotate(-7deg) scale(1.04)}
}
@media(max-width:1180px){
  .topbar{padding-inline:18px}.main-content{padding:26px 22px 44px}
  .workspace-intro{align-items:flex-start}.workspace-intro-actions{gap:9px}.materials-workspace{padding:19px}
  .materials-toolbar .secondary-actions{margin-left:0}
}
@media(max-width:900px){
  .sidebar{width:220px}.main-content{margin-left:220px;width:calc(100% - 220px);max-width:calc(100% - 220px)}
  .sidebar.collapsed~.main-content{margin-left:68px;width:calc(100% - 68px);max-width:calc(100% - 68px)}
  .workspace-local-label{display:none}#stats-summary.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px){
  .topbar{height:58px;padding:0 12px;gap:7px}.topbar-brand{gap:7px;flex:1}
  .topbar-brand .brand-logo-btn{width:31px;height:31px}.topbar-brand .brand-title-input{width:72px;font-size:17px}
  .topbar-brand .course-title-input{width:auto;min-width:0;max-width:none;flex:1;padding-left:9px;font-size:11px}
  .topbar-actions{gap:4px}.topbar-actions>button{min-width:36px;min-height:36px;padding:7px}
  .sidebar{top:58px;height:calc(100vh - 58px)}
  .main-content,.sidebar.collapsed~.main-content{width:100%;max-width:100%;margin-left:0;margin-top:58px;padding:17px 13px calc(100px + env(safe-area-inset-bottom,0px))}
  #dashboard-content{gap:20px}
  .workspace-intro{min-height:255px;flex-direction:column;align-items:stretch;gap:18px;padding:23px 19px}
  .workspace-intro::before{background-size:100% 100%,100% 7px;background-position:center,center 30%}
  .workspace-intro::after{right:0;top:18px;font-size:68px}
  .workspace-intro .page-header h1{font-size:clamp(38px,10vw,54px)}
  .workspace-intro .page-header p{margin-top:10px;font-size:12px;max-width:92%}
  .workspace-intro-actions{flex-direction:row;align-items:center;justify-content:flex-start}
  .workspace-add-btn{min-height:43px}.workspace-section-heading h2{font-size:21px}
  .materials-workspace{padding:16px 12px;border-radius:15px}.materials-heading-row{align-items:center;margin-bottom:15px}
  .materials-toolbar{align-items:stretch;gap:8px}.materials-toolbar .search-box{flex-basis:100%!important;max-width:none!important}
  .materials-toolbar .toolbar-group{display:flex;flex:1 1 100%;flex-wrap:wrap}
  .materials-toolbar .toolbar-group .form-select{flex:1 1 130px;min-width:0!important}
  .materials-toolbar .toolbar-group.secondary-actions{margin-left:0}.materials-toolbar .btn{min-height:42px}
  .workspace-composer .accordion-content{padding:15px 12px}
  .workspace-composer #syllabus-form{grid-template-columns:minmax(0,1fr);gap:14px}
  .workspace-composer .form-group.full-width{grid-column:1/-1}
  .workspace-summary-icon{width:36px;height:36px;flex-basis:36px}.workspace-summary-copy small{line-height:1.4}
  .workspace-schedule .accordion-content{padding:12px!important}#gantt-toolbar{align-items:flex-start!important}
  #gantt-toolbar>div:last-child{width:100%;flex-wrap:wrap}#gantt-toolbar .btn{min-height:40px}
  #schedule-calendar-view>div:first-child{gap:8px;flex-wrap:wrap}#schedule-calendar-view>div:first-child .btn{flex:1 1 auto}
  .data-table-wrapper{display:none!important}.data-cards-view{display:flex!important;flex-direction:column;gap:10px}
  .data-cards-view .data-card{padding:14px!important}.workspace-endnote{font-size:10px;text-align:center}
  .mobile-bottom-nav{z-index:120;border-top:1.5px solid var(--ds-ink);box-shadow:0 -7px 20px rgba(23,25,27,.09);padding-bottom:env(safe-area-inset-bottom,0px)}
  .mobile-nav-item{min-height:52px}.modal-overlay{padding:10px}
  .modal-panel,.modal-content{max-width:100%;max-height:calc(100dvh - 20px);overflow-y:auto}
  #personal-space-content{padding-top:18px}.fab-container{display:none!important}
  #sticky-note-fab{right:16px;bottom:calc(76px + env(safe-area-inset-bottom,0px));width:44px;height:44px}
  #sticky-note-panel{right:10px;bottom:calc(130px + env(safe-area-inset-bottom,0px));width:min(340px,calc(100vw - 20px));max-height:55vh}
}
@media(max-width:480px){
  .topbar-brand .course-title-input{display:none}.topbar-brand .brand-title-input{width:78px}
  .topbar-actions #gdsync-topbar-btn .gdsync-topbar-label{display:none}
  .main-content,.sidebar.collapsed~.main-content{padding-inline:10px}
  .workspace-intro{min-height:235px;padding:20px 15px}.workspace-intro .page-header h1{font-size:37px}
  .workspace-add-btn{padding-inline:11px}.materials-toolbar .toolbar-group{gap:6px}
  .workspace-summary-copy small{max-width:230px}#stats-summary .kpi-card{padding:14px 12px!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

.workspace-intro{
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  min-height:238px;padding:30px 32px;background:var(--ds-paper);color:var(--ds-ink);
  border:2px solid var(--ds-ink);border-radius:var(--ds-r-lg);box-shadow:var(--ds-shadow)
}
.workspace-intro::before{
  content:"";position:absolute;z-index:-2;inset:0;
  background:linear-gradient(180deg,transparent 0 35%,var(--ds-lime) 35% 57%,transparent 57%),
    linear-gradient(90deg,var(--ds-cyan) 0 100%);
  background-size:100% 100%,100% 9px;background-position:center,center 32%;background-repeat:no-repeat;
  opacity:.95
}
.workspace-intro::after{
  content:"MAKE\\A LEARN\\A REPEAT.";white-space:pre;position:absolute;z-index:-1;right:3%;top:2%;
  color:color-mix(in srgb,var(--ds-blue) 14%,transparent);font:900 clamp(54px,8vw,118px)/.77 'Bricolage Grotesque',sans-serif;
  letter-spacing:-.09em;transform:translate3d(var(--hero-drift-x,0px),var(--hero-drift-y,0px),0) rotate(-7deg);pointer-events:none
}
.workspace-intro-copy{min-width:0;max-width:700px}
.workspace-eyebrow,.workspace-section-kicker{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:9px;line-height:1.3;font-weight:900;letter-spacing:.17em}
.workspace-eyebrow{display:inline-flex;padding:6px 9px;background:var(--ds-ink);color:var(--ds-lime);border-radius:3px;transform:rotate(-1deg)}
.workspace-eyebrow-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ds-cyan);box-shadow:0 0 0 3px rgba(37,200,207,.18)}
.workspace-intro .page-header{margin:0;padding:0;border:0}
.workspace-intro .page-header h1{
  max-width:720px;margin:0;color:var(--ds-ink);font-size:clamp(46px,5.7vw,78px);font-weight:900;
  line-height:.88;letter-spacing:-.085em;text-wrap:balance;text-shadow:2px 2px 0 var(--ds-paper)
}
.workspace-intro .page-header p{max-width:500px;margin:16px 0 0;color:var(--ds-ink);font-size:13px;line-height:1.6;font-weight:650}
.workspace-intro-actions{display:flex;align-items:flex-end;gap:12px;flex-shrink:0;flex-direction:column}
.workspace-local-label{
  display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1.5px solid var(--ds-ink);
  border-radius:4px;background:var(--ds-paper);color:var(--ds-ink);font-size:10px;font-weight:750;white-space:nowrap;
  box-shadow:2px 2px 0 var(--ds-ink);transform:rotate(2deg)
}
.workspace-local-label i{color:var(--ds-blue)}
.workspace-add-btn{
  min-height:46px;padding:11px 16px;gap:9px;border:2px solid var(--ds-ink);border-radius:9px;
  background:var(--ds-blue);color:white;font-size:12px;font-weight:850;box-shadow:4px 4px 0 var(--ds-ink);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease
}
.workspace-add-btn:hover{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ds-ink);background:var(--ds-blue-deep);color:white}
/* Keep the floating help button blue; notification redesign must not affect it. */
.fab-container{z-index:10010!important;pointer-events:none}
#floating-help-btn{
  position:relative;z-index:10011!important;pointer-events:auto!important;
  background:#2563eb!important;color:#fff!important;border:1.5px solid #1d4ed8!important;
  box-shadow:3px 3px 0 #1e40af!important;
}
#floating-help-btn:hover,#floating-help-btn:focus-visible{
  background:#1d4ed8!important;color:#fff!important;box-shadow:4px 4px 0 #1e40af!important;
}


/* CRENCY-INSPIRED VISUAL SYSTEM v1 */
/* Art direction: deep plum, electric violet, acid lime, vivid pink and lavender.
   Existing component IDs, layout structure and application behavior remain unchanged. */
:root{
  --ds-canvas:#160727;
  --ds-paper:#fbf7ff;
  --ds-surface:#fffaff;
  --ds-raised:#e1d2ff;
  --ds-muted:#eee6ff;
  --ds-ink:#1b0735;
  --ds-muted-ink:#655578;
  --ds-line:#b9a7d6;
  --ds-line-soft:#e1d6f1;
  --ds-blue:#4c00ff;
  --ds-blue-deep:#3500c9;
  --ds-cyan:#3868ff;
  --ds-lime:#caff35;
  --ds-pink:#f0448b;
  --ds-orange:#ff642d;
  --ds-green:#a9e84b;
  --ds-red:#ef3028;
  --ds-sidebar:#f8f3ff;
  --ds-sidebar-ink:#1b0735;
  --ds-shadow:4px 4px 0 #1b0735;
  --ds-shadow-small:2px 2px 0 rgba(27,7,53,.2);
  --ds-shadow-float:0 20px 55px rgba(16,3,35,.25);
}
html[data-theme="dark"]{
  --ds-canvas:#10051f;
  --ds-paper:#1c0b35;
  --ds-surface:#241044;
  --ds-raised:#322054;
  --ds-muted:#2b1747;
  --ds-ink:#f7f0ff;
  --ds-muted-ink:#c4b4df;
  --ds-line:#624a84;
  --ds-line-soft:#382451;
  --ds-blue:#8657ff;
  --ds-blue-deep:#6c36f5;
  --ds-cyan:#5d82ff;
  --ds-lime:#caff35;
  --ds-pink:#ff5d9c;
  --ds-orange:#ff8156;
  --ds-green:#caff35;
  --ds-red:#ff665f;
  --ds-sidebar:#18092d;
  --ds-sidebar-ink:#f7f0ff;
  --ds-shadow:4px 4px 0 #080210;
  --ds-shadow-small:2px 2px 0 rgba(0,0,0,.35);
  --ds-shadow-float:0 20px 55px rgba(0,0,0,.4);
}
html,body{background-color:var(--ds-canvas)}
body{
  background-image:radial-gradient(rgba(202,255,53,.09) .7px,transparent .7px);
  background-size:9px 9px;
}
html[data-theme="dark"] body{
  background-image:radial-gradient(rgba(202,255,53,.07) .7px,transparent .7px);
}
.topbar{
  background:var(--ds-paper);
  border-bottom:2px solid var(--ds-ink);
}
.topbar-brand .brand-logo-btn{
  background:var(--ds-blue);color:#fff;border-color:var(--ds-ink);
  border-radius:50%;transform:rotate(-7deg);
}
#gdsync-topbar-btn{background:var(--ds-lime);color:#1b0735}
.sidebar{background:var(--ds-sidebar);border-right:2px solid var(--ds-ink)}
.nav-item.active{
  background:var(--ds-lime);color:#1b0735;
  border-color:#1b0735;box-shadow:3px 3px 0 #1b0735;
}
.workspace-intro{
  background:#18072f;color:#f5edff;border-color:#18072f;
  box-shadow:5px 5px 0 var(--ds-lime);
  border-radius:24px 12px 24px 12px;
}
.workspace-intro::before{
  background:
    linear-gradient(115deg,transparent 0 23%,#4c00ff 23% 42%,transparent 42%),
    linear-gradient(65deg,transparent 0 55%,#4c00ff 55% 73%,transparent 73%),
    linear-gradient(180deg,transparent 0 58%,#caff35 58% 75%,transparent 75%);
  opacity:1;
}
.workspace-intro::after{
  color:rgba(210,194,255,.12);
  font-size:clamp(58px,8vw,120px);
}
.workspace-eyebrow{
  background:var(--ds-lime);color:#1b0735;border-radius:999px;
  transform:none;letter-spacing:.12em;
}
.workspace-eyebrow-dot{background:#4c00ff;box-shadow:0 0 0 3px rgba(76,0,255,.18)}
.workspace-intro .page-header h1{
  color:#d2c2ff;text-shadow:none;letter-spacing:-.075em;
}
.workspace-intro .page-header p{color:#f7f0ff;font-weight:500}
.workspace-local-label{
  background:#241044;color:#f7f0ff;border-color:#7c5bb4;
}
.workspace-add-btn,.btn-primary{
  background:var(--ds-lime);border-color:#1b0735;color:#1b0735;
  box-shadow:3px 3px 0 #1b0735;
}
.workspace-add-btn:hover,.btn-primary:hover{
  background:#d9ff69;border-color:#1b0735;color:#1b0735;
  box-shadow:4px 4px 0 #1b0735;
}
.workspace-composer,.workspace-schedule,.materials-workspace{
  border-color:var(--ds-line);border-radius:16px;
  box-shadow:3px 3px 0 rgba(27,7,53,.16);
}
.workspace-summary-icon,.materials-heading-mark{
  background:var(--ds-pink);color:#1b0735;border-color:#1b0735;
}
#stats-summary .stat-card,#stats-summary .kpi-card,.stat-card,.kpi-card{
  border-color:var(--ds-ink);
  box-shadow:3px 3px 0 var(--ds-ink);
  border-radius:16px;
}
#stats-summary .stat-card:nth-child(4n+2),
#stats-summary .kpi-card:nth-child(4n+2){background:var(--ds-lime);color:#1b0735}
#stats-summary .stat-card:nth-child(4n+3),
#stats-summary .kpi-card:nth-child(4n+3){background:#d2c2ff;color:#1b0735}
#stats-summary .stat-card:nth-child(4n+4),
#stats-summary .kpi-card:nth-child(4n+4){background:#f8c9df;color:#1b0735}
.data-table thead th,.gantt-labels-header,.gantt-header{
  background:#1b0735!important;color:#f7f0ff!important;
}
.data-table tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--ds-pink) 5%,var(--ds-surface))}
.data-table tbody tr:hover td{background:color-mix(in srgb,var(--ds-lime) 17%,var(--ds-surface))}
.progress-fill{background:var(--ds-blue)}
.status-badge{font-weight:800}
.modal-overlay{background:rgba(16,5,31,.82)}
.modal-panel,.modal-content,.detail-modal-panel{
  border-color:var(--ds-ink);border-radius:18px;
  box-shadow:7px 7px 0 rgba(12,2,27,.28);
}
.modal-header,.detail-modal-header{background:var(--ds-paper)}
.modal-footer,.detail-modal-footer{background:var(--ds-paper)}
.detail-card-header{background:color-mix(in srgb,var(--ds-raised) 55%,var(--ds-paper))}
.detail-card-icon{background:var(--ds-pink);color:#1b0735}
.form-input,.form-select,.form-textarea{
  border-radius:10px;border-color:var(--ds-line);
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  border-color:var(--ds-blue);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ds-blue) 18%,transparent);
}
.due-notification-toast{
  border:1.5px solid var(--ds-ink);
  border-radius:14px;
  box-shadow:5px 5px 0 var(--ds-ink);
}
.due-toast-header{color:var(--ds-ink)}
.due-notification-item{
  display:grid;grid-template-columns:28px minmax(0,1fr) auto;
  align-items:center;gap:9px;padding:9px 10px;
  border:1px solid var(--ds-line-soft);border-radius:10px;
  background:var(--ds-surface);
}
.due-item-copy{display:flex;min-width:0;flex-direction:column;gap:2px}
.due-item-title{overflow-wrap:anywhere;line-height:1.35}
.due-item-meta{color:var(--ds-muted-ink);font-size:.74rem;line-height:1.35}
.due-item-status{
  max-width:120px;padding:4px 7px;border-radius:999px;
  background:var(--ds-muted);color:var(--ds-ink);
  font-size:.68rem;font-weight:800;text-align:center;line-height:1.25;
}
.due-notification-item.is-overdue .due-item-status{background:#ffe0e5;color:#a31336}
.due-notification-item.is-today .due-item-status{background:var(--ds-lime);color:#1b0735}
.due-item-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--ds-raised);color:var(--ds-blue)}
#floating-help-btn{
  background:var(--ds-blue);color:#fff;border-color:var(--ds-ink);
  box-shadow:3px 3px 0 var(--ds-ink);
}
#sticky-note-fab{background:var(--ds-lime);color:#1b0735}
::selection{background:var(--ds-pink);color:#1b0735}
@media(max-width:768px){
  .workspace-intro{
    box-shadow:3px 3px 0 var(--ds-lime);
    border-radius:18px 10px 18px 10px;
  }
  .workspace-intro::after{font-size:56px;right:-8px}
  .due-notification-item{grid-template-columns:25px minmax(0,1fr);gap:7px}
  .due-item-status{grid-column:2;justify-self:start;max-width:100%}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* LEARNING STUDIO — UI polish pass */
:root{
  --ds-canvas:#160727;--ds-paper:#fbf7ff;--ds-surface:#fffaff;--ds-raised:#e1d2ff;--ds-muted:#eee6ff;
  --ds-ink:#1b0735;--ds-muted-ink:#655578;--ds-line:#b9a7d6;--ds-line-soft:#e1d6f1;
  --ds-blue:#4c00ff;--ds-blue-deep:#3500c9;--ds-cyan:#26d9d1;--ds-lime:#caff35;--ds-pink:#f0448b;
  --ds-sidebar:#f8f3ff;--ds-sidebar-ink:#1b0735;--ds-shadow:4px 4px 0 #1b0735;
}
html[data-theme="dark"]{
  --ds-canvas:#10051f;--ds-paper:#1c0b35;--ds-surface:#241044;--ds-raised:#322054;--ds-muted:#2b1747;
  --ds-ink:#f7f0ff;--ds-muted-ink:#c4b4df;--ds-line:#624a84;--ds-line-soft:#382451;
  --ds-blue:#a287ff;--ds-blue-deep:#875fff;--ds-cyan:#47e6dc;--ds-lime:#caff35;--ds-pink:#ff75ad;
  --ds-sidebar:#18092d;--ds-sidebar-ink:#f7f0ff;--ds-shadow:4px 4px 0 #080210;
}

body{
  background-image:radial-gradient(rgba(210,194,255,.12) .75px,transparent .75px),
    radial-gradient(ellipse at 82% 0%,rgba(76,0,255,.15),transparent 34%);
  background-size:12px 12px,100% 620px;background-attachment:fixed;
}
.topbar{height:68px;padding-inline:clamp(14px,2.2vw,32px);box-shadow:0 5px 24px rgba(16,5,31,.14)}
.topbar-brand .brand-logo-btn{background:var(--ds-lime);color:var(--ds-ink);border-radius:12px 6px 12px 6px;transform:rotate(-5deg)}
.topbar-brand .brand-title-input{letter-spacing:-.08em}
.sidebar{top:68px;height:calc(100vh - 68px);width:244px}
.main-content{margin-top:68px;margin-left:244px;width:calc(100% - 244px);max-width:calc(100% - 244px);padding-top:34px}
.sidebar.collapsed~.main-content{margin-left:68px;width:calc(100% - 68px);max-width:calc(100% - 68px)}
.nav-item{border-radius:12px;min-height:42px}
.nav-item.active{background:var(--ds-lime);box-shadow:3px 3px 0 var(--ds-ink)}

.workspace-intro{
  min-height:264px;padding:clamp(24px,3.4vw,42px);border-radius:28px 14px 28px 14px;
  background:#18072f;color:#f7f0ff;border-color:#18072f;box-shadow:6px 6px 0 var(--ds-lime);
}
.workspace-intro::before{
  inset:0;background-image:
    radial-gradient(circle at 79% 44%,transparent 0 68px,rgba(202,255,53,.95) 69px 72px,transparent 73px),
    radial-gradient(circle at 78% 43%,rgba(76,0,255,.85) 0 108px,transparent 109px),
    radial-gradient(circle at 94% 23%,rgba(240,68,139,.96) 0 5px,transparent 6px),
    linear-gradient(0deg,transparent 0 82%,rgba(38,217,209,.92) 82% 84%,transparent 84%),
    repeating-linear-gradient(90deg,rgba(210,194,255,.10) 0 1px,transparent 1px 26px),
    repeating-linear-gradient(0deg,rgba(210,194,255,.10) 0 1px,transparent 1px 26px);
  background-size:100% 100%;opacity:.94;mask-image:linear-gradient(90deg,transparent 10%,#000 48%);
}
.workspace-intro::after{
  content:"✳  STUDY CLUB  ✳";top:20px;right:26px;left:auto;white-space:nowrap;
  padding:8px 12px;border:1px solid rgba(247,240,255,.45);border-radius:999px;
  background:#f0448b;color:#1b0735;font:900 10px/1 'DM Sans',sans-serif;letter-spacing:.14em;
  transform:rotate(5deg);box-shadow:3px 3px 0 #1b0735;
}
.workspace-eyebrow{background:var(--ds-lime);color:#1b0735;letter-spacing:.13em}
.workspace-eyebrow-dot{background:#4c00ff;box-shadow:0 0 0 3px rgba(76,0,255,.24)}
.workspace-intro .page-header h1{max-width:640px;font-size:clamp(52px,6vw,84px);line-height:.84;letter-spacing:-.09em;color:#d9c9ff}
.workspace-intro .page-header p{max-width:390px;color:#f7f0ff;font-size:14px;font-weight:500}
.workspace-local-label{border-radius:999px;background:#281345;color:#f7f0ff;border-color:#8767b5;box-shadow:2px 2px 0 #0d0318}
.workspace-add-btn,.btn-primary{min-height:46px;border-radius:999px;background:var(--ds-lime);color:#1b0735;border-color:#1b0735;box-shadow:3px 3px 0 #1b0735}
.workspace-add-btn:hover,.btn-primary:hover{background:#d9ff6a;color:#1b0735;transform:translate(1px,1px);box-shadow:2px 2px 0 #1b0735}

.workspace-section-heading h2{letter-spacing:-.055em}
.workspace-section-kicker{color:#d2c2ff}
.workspace-metrics-section .workspace-section-heading h2{color:#f7f0ff}
.workspace-metrics-section .workspace-section-heading p,.workspace-endnote{color:#c4b4df}
.workspace-composer,.workspace-schedule,.materials-workspace{
  border:1px solid color-mix(in srgb,var(--ds-line) 72%,transparent);border-radius:18px;
  box-shadow:0 12px 32px rgba(16,5,31,.12);overflow:hidden;
}
.workspace-composer>summary,.workspace-schedule>summary{min-height:76px;padding-inline:20px}
.workspace-summary-icon{border-radius:13px 7px 13px 7px;background:#f0448b;transform:rotate(-4deg)}
.workspace-composer .accordion-content,.workspace-schedule .accordion-content{padding:clamp(16px,2vw,26px)}
.workspace-composer .form-input,.workspace-composer .form-select,.workspace-composer .form-textarea,
.form-input,.form-select,.form-textarea{border-radius:12px}

#stats-summary .kpi-card,#stats-summary .stat-card,.stat-card,.kpi-card{border-radius:18px;box-shadow:3px 3px 0 var(--ds-ink)}
#stats-summary .kpi-card:nth-child(4n+2),#stats-summary .stat-card:nth-child(4n+2){background:var(--ds-lime)!important;color:#1b0735}
#stats-summary .kpi-card:nth-child(4n+3),#stats-summary .stat-card:nth-child(4n+3){background:#d2c2ff!important;color:#1b0735}
#stats-summary .kpi-card:nth-child(4n+4),#stats-summary .stat-card:nth-child(4n+4){background:#ffc5df!important;color:#1b0735}
#stats-summary .kpi-card:nth-child(4n+5),#stats-summary .stat-card:nth-child(4n+5){background:#aeece8!important;color:#1b0735}
#stats-summary .kpi-card:hover,#stats-summary .stat-card:hover{transform:translateY(-3px);box-shadow:4px 6px 0 var(--ds-ink)}

.materials-workspace{background:var(--ds-paper)}
.materials-heading-row{padding:22px 22px 6px}
.materials-toolbar{padding:8px 22px 18px}
#syllabus-table{border-collapse:separate;border-spacing:0;background:var(--ds-surface);overflow:hidden;border-radius:14px}
#syllabus-table thead th{background:#241044;color:#fbf7ff;border-color:#3d2858}
#syllabus-table tbody tr:hover td{background:color-mix(in srgb,var(--ds-lime) 16%,var(--ds-surface))}
#syllabus-table td,#syllabus-table th{padding-block:13px}
.status-badge{border-radius:999px;font-weight:800;letter-spacing:.01em}
.progress-fill{background:linear-gradient(90deg,#4c00ff,#f0448b)}

.gantt-container,.gantt-labels-panel,.gantt-timeline-panel{border-radius:12px}
.gantt-labels-header,.gantt-header{background:#241044!important;color:#fbf7ff!important}
.gantt-task-row,.gantt-row{border-color:var(--ds-line-soft)!important}
.modal-overlay{background:rgba(16,5,31,.82);backdrop-filter:blur(9px)}
.modal-panel,.modal-content,.detail-modal-panel{border-radius:20px;box-shadow:0 22px 70px rgba(8,2,16,.34)}
.modal-header,.detail-modal-header{border-bottom-color:var(--ds-line-soft)}
.modal-close{border-radius:50%}
.due-notification-toast{border-radius:18px;box-shadow:5px 5px 0 var(--ds-lime)}
.due-notification-item{border-radius:12px}
#floating-help-btn{border-radius:50%;background:#4c00ff;color:#fff}
#sticky-note-fab{border:2px solid var(--ds-ink);box-shadow:3px 3px 0 var(--ds-ink)}

@media(max-width:900px){
  .main-content{margin-left:0;width:100%;max-width:100%;padding-top:24px}
  .sidebar.collapsed~.main-content{margin-left:0;width:100%;max-width:100%}
  .workspace-intro{min-height:244px}
}
@media(max-width:768px){
  .topbar{height:62px;padding-inline:12px}.sidebar{top:62px;height:calc(100vh - 62px)}
  .main-content{margin-top:62px;padding:18px 14px 38px}
  .workspace-intro{min-height:250px;padding:24px 20px;align-items:flex-start;flex-direction:column;gap:14px}
  .workspace-intro::before{mask-image:linear-gradient(90deg,transparent 0%,#000 35%);background-position:center}
  .workspace-intro::after{top:15px;right:14px;font-size:8px}
  .workspace-intro .page-header h1{font-size:clamp(48px,12vw,68px)}
  .workspace-intro-actions{align-items:flex-start;flex-direction:row;flex-wrap:wrap}
  .workspace-local-label{white-space:normal}
  .materials-heading-row{padding:18px 15px 4px}.materials-toolbar{padding:8px 15px 14px}
  #stats-summary .kpi-card,#stats-summary .stat-card{padding:14px!important}
}
@media(max-width:480px){
  .main-content{padding-inline:10px}.workspace-intro{min-height:260px;padding:20px 16px}
  .workspace-intro .page-header h1{font-size:46px}.workspace-intro .page-header p{font-size:12px;margin-top:11px}
  .workspace-intro-actions{gap:9px}.workspace-add-btn{min-height:42px}
  .workspace-composer>summary,.workspace-schedule>summary{padding-inline:13px}
}

/* Modal order: fullscreen notes must cover the detail dialog that launched it. */
#fullscreen-notes-modal.fs-modal{z-index:12020!important}
#download-format-modal{z-index:12040!important}

/* Download actions use the same quiet secondary / lime primary hierarchy. */
#details-modal .detail-action-download,
#details-modal .detail-footer-download{
  position:relative;z-index:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:38px;padding:8px 13px;border:1px solid var(--ds-line)!important;border-radius:999px;
  background:var(--ds-paper)!important;color:var(--ds-ink)!important;box-shadow:2px 2px 0 var(--ds-ink);
  font-weight:750;text-decoration:none;transition:background .16s ease,transform .16s ease,box-shadow .16s ease;
}
#details-modal .detail-action-download::before,#details-modal .detail-action-download::after,
#details-modal .detail-footer-download::before,#details-modal .detail-footer-download::after{content:none!important;animation:none!important}
#details-modal .detail-action-download:hover,#details-modal .detail-footer-download:hover{
  background:var(--ds-lime)!important;border-color:var(--ds-ink)!important;color:var(--ds-ink)!important;
  transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ds-ink);
}
#details-modal .detail-action-download i,#details-modal .detail-footer-download i{color:var(--ds-blue);font-size:.95rem}
#details-modal .detail-card-notes .detail-action-download .detail-action-label{display:inline}
#details-modal .detail-footer-download{min-height:42px;padding-inline:17px}
#details-modal .detail-card-actions{gap:7px}

/* The collapsed sidebar is a centered icon rail, not a clipped mini-sidebar. */
.sidebar.collapsed{width:68px;box-sizing:border-box}
.sidebar.collapsed .sidebar-nav{padding:17px 8px 12px}
.sidebar.collapsed .nav-section{margin-bottom:15px}
.sidebar.collapsed .nav-section-label{display:none}
.sidebar.collapsed .nav-item,
.sidebar.collapsed .sidebar-footer .nav-item{
  display:flex;align-items:center;justify-content:center;gap:0;width:44px;min-width:44px;height:44px;min-height:44px;
  margin:0 auto 5px;padding:0!important;box-sizing:border-box;border:1px solid transparent;border-radius:13px;
  overflow:hidden;text-align:center;box-shadow:none;transform:none;
}
.sidebar.collapsed .nav-item .nav-icon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;margin:0;font-size:17px}
.sidebar.collapsed .nav-item .nav-label,
.sidebar.collapsed .nav-item .nav-badge-cloud{display:none!important}
.sidebar.collapsed .nav-item.active{background:var(--ds-lime);border-color:var(--ds-ink);color:var(--ds-ink)}
.sidebar.collapsed .nav-item.active .nav-icon{color:var(--ds-ink)}
.sidebar.collapsed .sidebar-footer{padding:10px 0}
.sidebar.collapsed .sidebar-footer .nav-item{border-top:0}

/* Deadline notice: prioritize a few useful items and keep the full list on demand. */
.due-notification-toast{
  right:22px!important;bottom:22px!important;width:min(420px,calc(100vw - 28px))!important;max-width:420px!important;
  max-height:min(68dvh,560px);padding:0!important;gap:0!important;overflow:hidden!important;
  color:var(--ds-ink)!important;background:var(--ds-paper)!important;border:1px solid var(--ds-line)!important;
  border-top:3px solid var(--ds-blue)!important;border-radius:18px!important;
  box-shadow:0 18px 46px rgba(16,5,31,.24)!important;
}
.due-toast-header{
  min-height:58px;padding:11px 14px!important;color:#fbf7ff!important;background:#241044!important;
  border-bottom:1px solid rgba(210,194,255,.18);font-size:.88rem!important;font-weight:800!important;
}
.due-toast-header>span>i{width:32px;height:32px;border-radius:11px;color:#1b0735!important;background:var(--ds-lime)!important}
.due-toast-header button{width:30px;height:30px;border-radius:50%;color:#d2c2ff!important}
.due-toast-header button:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.due-toast-list{
  max-height:min(44dvh,380px)!important;padding:11px!important;gap:7px!important;
  color:var(--ds-ink);background:color-mix(in srgb,var(--ds-muted) 38%,var(--ds-paper))!important;
  font-size:.8rem!important;scrollbar-width:thin;scrollbar-color:var(--ds-line) transparent;
}
.due-notification-item{
  grid-template-columns:30px minmax(0,1fr) auto;gap:9px;padding:10px!important;
  border:1px solid var(--ds-line-soft)!important;border-left:3px solid var(--ds-blue)!important;
  border-radius:12px!important;background:var(--ds-surface)!important;color:var(--ds-ink)!important;
  box-shadow:0 2px 5px rgba(16,5,31,.06);min-width:0;
}
.due-notification-item.is-overdue{border-left-color:#e43f71!important}
.due-notification-item.is-today{border-left-color:#9aaa00!important}
.due-notification-item.is-upcoming{border-left-color:#4c00ff!important}
.due-item-icon{width:29px;height:29px;border-radius:10px;color:#3500c9;background:#eee6ff}
.due-notification-item.is-overdue .due-item-icon{color:#b42352;background:#ffe2ed}
.due-notification-item.is-today .due-item-icon{color:#3e4700;background:#eaffab}
.due-item-copy{gap:3px}
.due-item-title{color:var(--ds-ink);font-size:.79rem;font-weight:750;line-height:1.35}
.due-item-meta{color:var(--ds-muted-ink);font-size:.69rem}
.due-item-status{max-width:112px;padding:5px 8px;border-radius:999px;background:#eee6ff;color:#3500c9;font-size:.64rem}
.due-notification-item.is-overdue .due-item-status{background:#ffe2ed;color:#a31848}
.due-notification-item.is-today .due-item-status{background:#eaffab;color:#3e4700}
.due-toast-more{
  align-self:center;min-height:34px;padding:6px 12px;border:0;border-radius:999px;background:transparent;
  color:var(--ds-blue);font:750 .76rem 'DM Sans',sans-serif;cursor:pointer;
}
.due-toast-more:hover{background:var(--ds-muted);color:var(--ds-ink)}
html[data-theme="dark"] .due-notification-toast{box-shadow:0 18px 46px rgba(0,0,0,.42)!important}
html[data-theme="dark"] .due-notification-item.is-overdue .due-item-icon,
html[data-theme="dark"] .due-notification-item.is-overdue .due-item-status{color:#ffc0d2;background:#51233a}
html[data-theme="dark"] .due-notification-item.is-today .due-item-icon,
html[data-theme="dark"] .due-notification-item.is-today .due-item-status{color:#edff9d;background:#3d461c}
@media(max-width:600px){
  .due-notification-toast{left:12px!important;right:12px!important;bottom:76px!important;width:auto!important;max-width:none!important;max-height:64dvh}
  .due-toast-list{max-height:min(42dvh,330px)!important}
  .due-notification-item{grid-template-columns:29px minmax(0,1fr) auto;gap:8px;padding:9px!important}
  .due-item-status{grid-column:auto;justify-self:end;max-width:105px}
}
@media(max-width:420px){
  .due-notification-item{grid-template-columns:28px minmax(0,1fr);}
  .due-item-status{grid-column:2;justify-self:start;max-width:none}
}