/* =========================================================

   TEAMFLOW MASTER STYLESHEET

   VERSION 2

========================================================= */

/* =========================================================

   1. DESIGN TOKENS / VARIABLES

========================================================= */

:root{
  --bg:#f5f8fc;
  --panel:#ffffff;
  --text:#172033;
  --muted:#667085;
  --line:#e5eaf2;

  --blue2:#2f6fed;
  --green:#1c9a6a;
  --purple:#7257d9;
  --orange:#e1812c;
  --red:#d94a4a;

  --header-height:170px;

  --tf-radius-sm:12px;
  --tf-radius-md:18px;
  --tf-radius-lg:28px;

  --tf-shadow-sm:0 2px 6px rgba(15,23,42,.05);
  --tf-shadow-md:0 8px 18px rgba(15,23,42,.08);
  --tf-shadow-lg:0 18px 36px rgba(15,23,42,.12);

  --tf-space-xs:6px;
  --tf-space-sm:12px;
  --tf-space-md:18px;
  --tf-space-lg:28px;

  --tf-blue:#2563eb;
  --tf-blue-soft:#eef5ff;
  --tf-line:#dbe4f0;

  --glass-bg:rgba(255,255,255,0.72);
  --glass-border:rgba(255,255,255,0.55);

  --shadow-soft:0 10px 30px rgba(15,23,42,0.06);
  --shadow-hover:0 18px 40px rgba(15,23,42,0.12);

  --gradient-blue:linear-gradient(135deg,#2563eb 0%,#4f46e5 100%);
  --gradient-green:linear-gradient(135deg,#059669 0%,#10b981 100%);
  --gradient-orange:linear-gradient(135deg,#ea580c 0%,#f59e0b 100%);
  --gradient-purple:linear-gradient(135deg,#7c3aed 0%,#9333ea 100%);
}


/* =========================================================
   2. GLOBAL RESETS
========================================================= */

*{
  box-sizing:border-box;
}

body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  font-size:14px;
}

/* =========================================================
   3. LAYOUT SYSTEM
========================================================= */

.app{
  display:flex;
  min-height:100vh;
}

.main{
  flex:1;
  min-width:0;
}

#content{
  padding:28px 34px;
}

.grid{
  display:grid;
  gap:18px;
}

.cols-4{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.cols-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.cols-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

/* =========================================================
   4. SIDEBAR + TOPBAR
========================================================= */

.sidebar{
  width:270px;
  background:#ffffff;
  border-right:1px solid var(--line);
  padding:0 16px 20px;
  overflow:auto;
}

.brand{
  height:var(--header-height);
  min-height:var(--header-height);
  padding:0 20px 10px;
  margin:0 -16px 26px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  border-bottom:1px solid #c7d6e8;
  background:#ffffff;
  cursor:pointer;
}

.teamflow-logo-img{
  width:220px;
  height:auto;
  display:block;
}

.nav-section{
  border-left:4px solid #ddd;
  margin:18px 0 24px;
  padding-left:12px;
}

.nav-section.blue{border-color:var(--blue2);}
.nav-section.green{border-color:var(--green);}
.nav-section.purple{border-color:var(--purple);}
.nav-section.orange{border-color:var(--orange);}
.nav-section.red{border-color:var(--red);}
.nav-section.teal{border-left:5px solid #14b8a6;}

.nav-section h2{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  color:#38455c;
  margin:0 0 8px;
  font-weight:700;
}

.nav-section button{
  display:block;
  width:100%;
  border:0;
  background:transparent;
  text-align:left;
  padding:9px 10px;
  border-radius:10px;
  color:#344054;
  cursor:pointer;
  font-size:14px;
}

.nav-section button:hover,
.nav-section button.active{
  background:#f1f6ff;
  color:#1d4ed8;
}

.sidebar-footer{
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid #e5eaf2;
}

.sidebar-link-btn{
  width:100%;
  border:1px solid #dbe4f0;
  background:#f8fbff;
  color:#344054;
  border-radius:12px;
  padding:11px 12px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  text-align:left;
}

.sidebar-link-btn:hover{
  background:#eef5ff;
  color:#1d4ed8;
}

.home-button{
  width:calc(100% - 16px);
  border:0;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#ffffff;
  border-radius:14px;
  padding:14px 16px;
  font-size:14px;
  font-weight:800;
  text-align:left;
  cursor:pointer;
  margin-bottom:18px;
  box-shadow:0 8px 18px rgba(37,99,235,.18);
}

.home-button{
  display:flex;
  align-items:center;
  gap:10px;
}

.home-button i{
  display:flex;
  align-items:center;
}

.home-button:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(37,99,235,.25);
}

.topbar{
  height:var(--header-height);
  min-height:var(--header-height);
  background:linear-gradient(180deg,#d9e8f8 0%,#dbe8f6 100%);
  border-bottom:1px solid #c7d6e8;
  display:grid;
  grid-template-columns:760px 1fr;
  align-items:end;
  gap:40px;
  padding:22px 34px 18px;
  display:flex;

  justify-content:space-between;

  align-items:flex-end;
}

.topbar-live-report-btn{
  margin-left:20px;
  white-space:nowrap;
}

.topbar h2{
  font-size:28px;
  margin:0 0 6px;
}

.topbar p{
  margin:0;
  color:#506079;
}

.topbar-left,
.context-selector{
  align-self:end;
}

.topbar-left{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.selectors{
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.context-selector{
  justify-self:end;
  width:900px;
}

.context-control{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.context-control label{
  font-size:12px;
  font-weight:600;
  color:#334155;
  letter-spacing:.02em;
}

.context-control select,
.selectors select{
  appearance:none;
  -webkit-appearance:none;
  min-width:210px;
  border:1px solid #cbd7e8;
  background-color:#ffffff;
  border-radius:14px;
  padding:12px 48px 12px 16px;
  color:#26354d;
  font-weight:600;
  cursor:pointer;
  box-shadow:0 2px 6px rgba(15,23,42,.04);

 
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px);
  background-size:6px 6px;
  background-repeat:no-repeat;
}

.context-control select:hover,
.selectors select:hover{
  border-color:#94b6ea;
}

.context-control select:focus,
.selectors select:focus{
  outline:none;
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

.context-helper{
  width:100%;
  margin-top:10px;
  font-size:12px;
  color:#64748b;
  line-height:1.4;
}

.workspace-context{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 34px;
  border-bottom:1px solid #dbe4f0;
  background:#ffffff;
  color:#475569;
  font-size:14px;
  font-weight:600;
}

.workspace-context .sep{
  color:#9aa7b8;
  font-weight:800;
}

.observer-view-only{
  display:flex;
  align-items:center;
  gap:10px;

  width:100%;
  padding:14px 16px;

  border-radius:14px;
  border:1px solid #c4b5fd;

  background:#f5f3ff;
  color:#5b21b6;

  font-size:14px;
  font-weight:850;
}

.observer-view-only::before{
  content:"👁";
  font-size:18px;
}

.context-control.locked-context::after{
  content: none;
  display: none;
}

.context-control{
  position: relative;
}

.context-lock{
  position: absolute;
  top: 30px;
  right: 14px;
  width: 14px;
  height: 14px;
  color: #667085;
  pointer-events: none;
  z-index: 6;
}

.context-control select:disabled{

  background:#f8fafc;

  border:1px solid #d0d5dd;

  color:#475467;

  opacity:1;

}

/* =========================================================
   5. BUTTONS + FORMS
========================================================= */

.btn{
  border:0;
  background:#2f6fed;
  color:#ffffff;
  border-radius:12px;
  padding:10px 14px;
  font-weight:700;
  cursor:pointer;
}

.btn.secondary{
  background:#2563eb;
  color:#ffffff;
  border-radius:12px;
  padding:10px 16px;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}

.btn.secondary:hover{
  background:#1d4ed8;
  transform:translateY(-1px);
}

textarea,
input,
.field{
  width:100%;
  border:1px solid #d9e3f2;
  border-radius:12px;
  padding:11px;
  font:inherit;
  background:#ffffff;
  margin:8px 0;
}

textarea{
  border-radius:14px;
  padding:14px;
  background:#fbfdff;
  resize:vertical;
}

textarea:focus,
input:focus,
.field:focus{
  outline:none;
  border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,.12);
}

.table{
  width:100%;
  border-collapse:collapse;
}

.table th,
.table td{
  text-align:left;
  border-bottom:1px solid var(--line);
  padding:12px 8px;
}

.table th{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
}

footer{
  padding:18px 34px;
  color:#8a94a6;
  font-size:12px;
}


/* =========================================================
   6. CARD SYSTEM
========================================================= */

/* SMALL CARD */

.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  margin-bottom:18px;
  box-shadow:0 2px 6px rgba(25,45,75,.05);
  transition:.15s;
}

.card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(25,45,75,.08);
}

.card h3,
#content h3:not(.live-report-banner h3){
  margin:0 0 8px;
  font-size:17px;
  color:#23476a;
  font-weight:650;
}

.card p{
  color:var(--muted);
  margin:0 0 10px;
  line-height:1.5;
}

/* BASE CARD */

.card-base{
  position:relative;

  overflow:hidden;

  border-radius:24px;

  border:1px solid rgba(226,232,240,0.9);

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.96),
      rgba(248,250,252,0.94)
    );

  box-shadow:
    0 10px 30px rgba(15,23,42,0.06);

  backdrop-filter:blur(14px);

  transition:
    transform 0.28s ease,
    box-shadow 0.28s ease,
    border-color 0.28s ease;
}

/* HOVER */

.card-base:hover{
  transform:translateY(-4px);

  box-shadow:
    0 18px 42px rgba(15,23,42,0.12);
}

/* PREMIUM */

.card-premium{
  border-top:5px solid #2563eb;
}

/* SUCCESS */

.card-success{
  border-top:5px solid #10b981;
}

/* WARNING */

.card-warning{
  border-top:5px solid #f59e0b;
}

/* DANGER */

.card-danger{
  border-top:5px solid #ef4444;
}

/* PURPLE */

.card-purple{
  border-top:5px solid #8b5cf6;
}

/* GLASS */

.card-glass{
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.72),
      rgba(255,255,255,0.58)
    );

  backdrop-filter:blur(20px);
}

/* SOFT GLOW */

.card-glow{
  position:absolute;

  top:-80px;
  right:-80px;

  width:180px;
  height:180px;

  border-radius:50%;

  background:
    radial-gradient(
      rgba(59,130,246,0.12),
      transparent 70%
    );

  pointer-events:none;
}

/* =========================================================
   7. DASHBOARD SYSTEM
========================================================= */
/* DASHBOARD METRIC CARDS */

.dashboard-metric-card{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:10px;
}

.dashboard-metric-top{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  margin-bottom:8px;
}

.dashboard-metric-icon{
  width:54px;
  height:54px;
  min-width:54px;
  border-radius:16px;
  color:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:900;
  line-height:1;
  box-shadow:
    0 10px 20px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.metric-blue{
  background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);
}

.metric-green{
  background:linear-gradient(135deg,#16a34a 0%,#15803d 100%);
}

.metric-orange{
  background:linear-gradient(135deg,#f59e0b 0%,#ea580c 100%);
}

.metric-purple{
  background:linear-gradient(135deg,#7c3aed 0%,#6d28d9 100%);
}

.metric-red{
  background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);
}

.dashboard-metric-label{
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#64748b;
}

.dashboard-metric-value{
  font-size:42px;
  line-height:1.08;
  font-weight:800;
  letter-spacing:-1.5px;
  color:#0f172a;
}

.dashboard-metric-card p{
  margin:0;
  color:#64748b;
  font-size:15px;
  line-height:1.45;
}

/* PROGRESS RING */

.progress-ring{
  position:relative;
  width:108px;
  height:108px;
  border-radius:50%;
  background:
    conic-gradient(
      #2563eb calc(var(--progress) * 1%),
      #e5e7eb calc(var(--progress) * 1%)
    );
  display:grid;
  place-items:center;
  margin:0 auto 18px;
}

.progress-ring::before{
  content:"";
  position:absolute;
  width:78px;
  height:78px;
  border-radius:50%;
  background:#ffffff;
}

.progress-ring span{
  position:relative;
  z-index:2;
  font-size:22px;
  font-weight:800;
  color:#0f172a;
}

/* DATA CARD COLOUR BARS */

.data-card{
  border-top:5px solid #2563eb !important;
}

.data-card-green{
  border-top-color:#16a34a !important;
}

.data-card-orange{
  border-top-color:#f59e0b !important;
}

.data-card-red{
  border-top-color:#dc2626 !important;
}

.data-card-purple{
  border-top-color:#7c3aed !important;
}

.activity-feed-card{
  background:#fff;
  border-radius:20px;
  padding:22px 10px 22px 22px;
  border:1px solid #e6ebf2;
  box-shadow:0 6px 18px rgba(15,23,42,0.05);
  min-height:auto;
  max-height:600px;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:auto;
  scrollbar-color:#94a3b8 #e2e8f0;
}

.activity-feed-card::-webkit-scrollbar{
  width:14px;
}

.activity-feed-card::-webkit-scrollbar-track{
  background:#e2e8f0;
  border-radius:12px;
}

.activity-feed-card::-webkit-scrollbar-thumb{
  background:#94a3b8;
  border-radius:12px;
  border:3px solid #e2e8f0;
}

.activity-feed-card::-webkit-scrollbar-thumb:hover{
  background:#64748b;
}

.activity-feed-card h3{
  margin:0 0 18px;
  color:#17324d;
  font-size:18px;
}

.activity-feed-card .empty-state{
  min-height:auto;
  padding:18px;
}

.activity-item{
  display:flex;
  gap:14px;
  padding:14px 0 14px 14px;
  border-bottom:1px solid #eef2f7;
  border-left:4px solid #cbd5e1;
}

.activity-item:last-child{
  border-bottom:none;
}

.activity-icon{
  width:36px;
  height:36px;
  border-radius:50%;
  background:#2563eb;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  flex-shrink:0;
}

.activity-content p{
  margin:0;
  font-size:14px;
  color:#17324d;
  font-weight:600;
}

.activity-content span{
  display:block;
  margin-top:4px;
  font-size:12px;
  color:#64748b;
}

.activity-task{ border-left-color:#2563eb; }
.activity-status{ border-left-color:#f59e0b; }
.activity-evidence{ border-left-color:#16a34a; }
.activity-risk{ border-left-color:#dc2626; }
.activity-general{ border-left-color:#94a3b8; }
.activity-note{ border-left-color:#7c3aed; }

.activity-task .activity-icon{ background:#2563eb; }
.activity-status .activity-icon{ background:#f59e0b; }
.activity-evidence .activity-icon{ background:#16a34a; }
.activity-risk .activity-icon{ background:#dc2626; }
.activity-general .activity-icon{ background:#64748b; }
.activity-note .activity-icon{ background:#7c3aed; }

.activity-feed-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.activity-feed-header h3{
  margin:0;
}

.activity-filter-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.activity-filter-bar button{
  border:1px solid #dbe4f0;
  background:#fff;
  color:#334155;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.activity-filter-bar button.active{
  background:#2563eb;
  color:#fff;
  border-color:#2563eb;
}

.clickable-activity{
  cursor:pointer;
  transition:all 0.2s ease;
}

.hero-metric-card,
.dashboard-action-item{
  border-radius:var(--tf-radius-md);
}


/* TEAM DASHBOARD HERO styles are controlled in Section 16 V3 overrides. */

/* =========================================================
   8. WORKFLOW SYSTEM
========================================================= */


.workflow-card{
  min-height:210px;
}
.workflow-unlocked{
  border-left:6px solid #16a34a;
}

.workflow-locked{
  border-left:6px solid #94a3b8;
  opacity:.75;
}

.workflow-locked .bar{
  background:#94a3b8;
}

.workflow-unlocked .bar{
  background:#16a34a;
}

.stage-guidance,
#stageGuidancePanel,
#evidenceStageGuidancePanel{
  margin:14px 0 18px;
  padding:16px;
  border-radius:16px;
  border:1px solid #dbe4f0;
  background:#f8fbff;
  border-left:5px solid #16a34a;
}

#evidenceStageGuidancePanel{
  border-left-color:#3b82f6;
}
.workflow-guidance-card{
  border:1px solid #e5eaf2;
  border-radius:16px;
  padding:16px;
  margin-bottom:14px;
  background:#fff;
}

.workflow-guidance-unlocked{
  border-left:5px solid #16a34a;
}

.workflow-guidance-locked{
  border-left:5px solid #94a3b8;
  background:#f8fafc;
}

.workflow-guidance-top{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
}

.workflow-guidance-top h4{
  margin:0 0 5px;
  font-size:16px;
  color:#10233f;
}

.workflow-guidance-top p{
  margin:0;
  color:#64748b;
  font-size:13px;
  line-height:1.4;
}

.workflow-lock-pill{
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

.workflow-lock-pill.unlocked{
  background:#dcfce7;
  color:#166534;
}

.workflow-lock-pill.locked{
  background:#e2e8f0;
  color:#475569;
}

.workflow-stage-progress{
  height:10px;
  background:#e5eaf2;
  border-radius:999px;
  overflow:hidden;
  margin:14px 0 8px;
}

.workflow-stage-progress-bar{
  height:100%;
  background:#2563eb;
  border-radius:999px;
}

.workflow-guidance-locked .workflow-stage-progress-bar{
  background:#94a3b8;
}

.workflow-guidance-meta{
  display:flex;
  justify-content:space-between;
  color:#64748b;
  font-size:12px;
  font-weight:700;
  margin-bottom:12px;
}

.workflow-next-action{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:12px;
  padding:11px 12px;
  font-size:13px;
  color:#334155;
}

/* =========================================================
   9. TASK MANAGEMENT
========================================================= */

.priority-high {
  background: #fee2e2;
  color: #b91c1c;
}

.priority-medium {
  background: #fef3c7;
  color: #92400e;
}

.priority-low {
  background: #dcfce7;
  color: #166534;
}

.status-completed {
  background: #dcfce7;
  color: #166534;
}

.status-progress {
  background: #dbeafe;
  color: #1d4ed8;
}

.status-pending {
  background: #f3f4f6;
  color: #374151;
}

.task-attention-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.attention-red {
  background: #fee2e2;
  color: #b91c1c;
}

.attention-orange {
  background: #ffedd5;
  color: #c2410c;
}

.attention-yellow {
  background: #fef9c3;
  color: #854d0e;
}

.attention-grey {
  background: #e5e7eb;
  color: #374151;
}


.task-meta-groups{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  margin-top:12px;
}

.task-meta-group{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.task-meta-group small{
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#64748b;
}
.clickable-task-header{
  cursor:pointer;
}

.clickable-task-header:hover .task-expand-indicator{
  background:#dbeafe;
  text-decoration:none;
}


.task-board-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 18px;
}

.task-list-card {
  overflow: visible;
}

.task-list-card .section-header {
  margin-bottom: 26px;
}

.task-filter-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
  margin: 16px 0 20px;
}

.task-filter-bar .field {
  margin: 0;
}

.task-card,
.task-card-modern {
  background: #ffffff;
  border: 1px solid #e7ecf3;
  border-left: 7px solid #94a3b8;
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all 0.2s ease;
}

.task-card:hover,
.task-card-modern:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

.task-card.task-green,
.task-green {
  border-left-color: #16a34a !important;
}

.task-card.task-orange,
.task-orange {
  border-left-color: #f59e0b !important;
}

.task-card.task-red,
.task-red {
  border-left-color: #dc2626 !important;
}

.task-card.task-grey,
.task-grey {
  border-left-color: #94a3b8 !important;
}

.task-card-top {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  justify-content: space-between;
}

.task-card-title-wrap {
  flex: 1;
  min-width: 0;
}

.task-card-title-wrap h3 {
  margin: 0 0 10px;
  font-size: 18px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-owner-avatar {
  width: 46px;
  height: 46px;
  min-width: 46px;
  border-radius: 50%;
  background: #2563eb;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
  flex-shrink: 0;
}

.task-meta,
.task-actions,
.task-meta-row,
.task-card-footer,
.task-footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.task-card-body {
  border-top: 1px solid #eef2f7;
  padding-top: 16px;
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.task-card-body p,
.task-responsibility,
.task-prompt {
  margin: 0;
  line-height: 1.5;
}

.task-responsibility,
.task-prompt {
  margin-top: 10px;
  padding: 12px;
  border-radius: 12px;
  background: #f8fbff;
  border: 1px solid #dbe4f0;
  font-size: 13px;
  color: #475569;
}

.task-prompt {
  background: #fff8e8;
  border-color: #f1d28c;
}

.task-stage-pill,
.task-priority-pill,
.task-status-pill,
.task-attention-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.task-stage-pill {
  background: #eef2ff;
  color: #4338ca;
}

.task-footer {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #e5eaf2;
}

.task-footer-left {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.task-footer-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.task-footer-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #dbe4f0;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}

.task-actions select,
.task-footer-actions select,
.task-status-select,
select.task-status-select {
  appearance: none;
  -webkit-appearance: none;
  width: 190px;
  min-width: 190px;
  height: 46px;
  border: 1px solid #d9e3f2;
  border-radius: 14px;
  padding: 0 42px 0 16px;
  background:
    linear-gradient(45deg, transparent 50%, #64748b 50%),
    linear-gradient(135deg, #64748b 50%, transparent 50%),
    #ffffff;
  background-position:
    calc(100% - 20px) 20px,
    calc(100% - 14px) 20px,
    0 0;
  background-size:
    6px 6px,
    6px 6px,
    100% 100%;
  background-repeat: no-repeat;
  color: #172033;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(15,23,42,0.05);
  cursor: pointer;
}

.task-status-select:focus,
select.task-status-select:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37,99,235,0.14);
}

.task-alert {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 18px;
padding: 14px 16px;
 margin-bottom: 20px;
  border-radius: 18px;
  border: 1px solid;
  font-size: 15px;
}

.task-alert-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: 900;
  line-height: 1;
}

.task-alert strong {
  display: block;
  font-size: 18px;
  font-weight: 900;
  margin-bottom: 6px;
}

.task-alert span {
  display: block;
  line-height: 1.45;
}

.task-alert-overdue {
  background: #fff1f2;
  border-color: #fecaca;
  color: #991b1b;
}

.task-alert-overdue .task-alert-icon {
  background: #b91c1c;
  color: #ffffff;
}

.task-alert-today {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}

.task-alert-today .task-alert-icon {
  background: #ea580c;
  color: #ffffff;
}

.task-card-modern{
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.task-card-body,
.task-card-footer{
animation: taskExpandFade 0.45s ease both;
}

@keyframes taskExpandFade{
  from{
    opacity:0;
    transform:translateY(-14px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }
}

.task-expand-indicator{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  cursor:pointer;
  margin-top:6px;
  padding:4px 9px;
  border-radius:999px;
  background:#eef5ff;
  color:#2563eb;
  font-size:12px;
  font-weight:800;
}

.task-expand-indicator:hover{
  background:#dbeafe;
}

.clickable-task-header{
  cursor:pointer;
}

.task-form-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:0;
}

.task-form-header h3{
  margin:0 !important;
}

.task-form-header + .grid{
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid #eef2f7;
  animation: taskExpandFade 0.35s ease both;
}
.task-form-expand{
  border-top:1px solid #eef2f7;
  padding-top:18px;
  margin-top:18px;
  animation:taskExpandFade 0.35s ease;
}

/* =========================================================
   10. EVIDENCE SYSTEM
========================================================= */

.evidence-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;

  padding:14px 0;
  border-bottom:1px solid #edf1f7;
}

.evidence-row strong{
  display:block;
  font-size:15px;
  color:#10233f;
}

.evidence-row span{
  display:block;
  margin-top:4px;
  color:#667085;
  font-size:13px;
}

.evidence-actions{
  display:flex;
  gap:8px;
  flex-shrink:0;
}

.evidence-actions button{
  border:0;
  background:#2563eb;
  color:#fff;
  border-radius:10px;
  padding:7px 11px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.evidence-actions button:hover{
  background:#1d4ed8;
}

/* =========================================================
   11. REPORTING + ASSIGNMENTS
========================================================= */

.report-health-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  margin-bottom:12px;
  flex-wrap:wrap;
}

.report-health-pill{
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}

.report-health-good{
  background:#dcfce7;
  color:#166534;
}

.report-health-moderate{
  background:#fef3c7;
  color:#92400e;
}

.report-health-warning{
  background:#fee2e2;
  color:#991b1b;
}

.report-evidence-count{
  font-size:12px;
  font-weight:600;
  color:#667085;
}

.assignment-card{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.assignment-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.assignment-card-top h3{
  margin:0;
  font-size:20px;
}

.assignment-card-top p{
  margin-top:4px;
  color:#667085;
}

.assignment-meta{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.assignment-meta-row{
  display:flex;
  justify-content:space-between;
  font-size:14px;
}

.assignment-linked-stages{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.assignment-stage-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.stage-pill{
  background:#eef4ff;
  color:#1d4ed8;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}
.assignment-setup-banner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  background:linear-gradient(135deg,#ffffff 0%,#eef5ff 100%);
  border:1px solid #dbe4f0;
  border-radius:26px;
  padding:28px 32px;
  margin-bottom:24px;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.assignment-setup-banner h2{
  margin:0 0 8px;
  font-size:32px;
  color:#10233f;
}

.assignment-setup-banner p{
  margin:0;
  max-width:760px;
  color:#52637c;
  line-height:1.5;
}

.assignment-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.assignment-premium-card{
  padding:34px 36px;
}

.assignment-premium-top{
  display:grid;
  grid-template-columns:1fr 116px;
  gap:24px;
  align-items:center;
  padding-bottom:26px;
  margin-bottom:28px;
  border-bottom:1px solid #dbe4f0;
}

.assignment-title-block h3{
  margin:0;
  font-size:32px !important;
  line-height:1.08;
  color:#10233f !important;
}

.assignment-code{
  font-size:13px;
  font-weight:900;
  letter-spacing:.16em;
  color:#2563eb;
  text-transform:uppercase;
  margin-bottom:8px;
}

.assignment-weight-ring{
  width:104px;
  height:104px;
  border-radius:50%;
  border:3px solid #2563eb;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:#fff;
}

.assignment-weight-ring strong{
  font-size:28px;
  color:#2563eb;
  line-height:1;
}

.assignment-weight-ring span{
  margin-top:4px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#667085;
}

.assignment-info-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-bottom:20px;
}

.assignment-info-row div{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:16px;
  padding:18px;
}

.assignment-timeline,
.assignment-pace,
.assignment-readiness{
  margin-top:18px;
  padding:18px 20px;
}

.assignment-progress{
  margin-top:22px;
}

.assignment-linked-stages{
  margin-top:22px;
}

.assignment-stage-pills{
  margin-top:12px;
}

/* =========================================================
   12. MODULE SYSTEM
========================================================= */

.module-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;
  margin-top:24px;
}

.module-card{
  border:1px solid #e5e7eb;
  background:#ffffff;
  border-radius:18px;
  padding:22px;
  text-align:left;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(15,23,42,0.06);
  transition:transform 0.2s ease, box-shadow 0.2s ease;
}

.module-card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(15,23,42,0.12);
}

.module-icon{
  width:52px;
  height:52px;
  border-radius:16px;
  background:#f1f5f9;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
  margin-bottom:16px;
}

.module-card h3{
  margin:0 0 8px;
  font-size:1.05rem;
}

.module-card p{
  margin:0 0 16px;
  color:#64748b;
  line-height:1.45;
}

.module-card span{
  font-weight:700;
  color:#2563eb;
}


/* =========================================================
   13. RISK + ANALYTICS
========================================================= */

.risk-panel,
.notes-panel{
  min-height:250px;
}

.risk-panel{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

.notes-panel textarea{
  min-height:150px;
}
.teamworkspace-balance-row{
  align-items:stretch;
}

.teamworkspace-balance-row > div,
.teamworkspace-balance-row > .card{
  height:100%;
}

.teamworkspace-balance-row .risk-panel,
.teamworkspace-balance-row .notes-panel{
  height:100%;
  min-height:280px;
}
.risk-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-top:18px;
}

.risk-metric{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:14px;
  padding:14px;
  text-align:center;
}

.risk-metric strong{
  display:block;
  font-size:24px;
  color:#10233f;
  margin-bottom:4px;
}

.risk-metric span{
  font-size:12px;
  font-weight:700;
  color:#64748b;
}

.risk-intervention-box{
  margin-top:18px;
  padding:14px;
  border-radius:14px;
  background:#fff7ed;
  border:1px solid #fdba74;
}

.risk-intervention-box strong{
  display:block;
  margin-bottom:8px;
  color:#9a3412;
}

.risk-intervention-box ul{
  margin:0;
  padding-left:18px;
  color:#7c2d12;
}

.risk-success-box{
  margin-top:18px;
  padding:14px;
  border-radius:14px;
  background:#ecfdf5;
  border:1px solid #86efac;
  color:#166534;
  font-weight:700;
}

.status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:140px;
  min-height:42px;
  padding:10px 16px;
  border-radius:999px;
  font-size:13px;
  font-weight:800;
}

.risk-badge-none{
  background:#dff5e7;
  color:#1d7a3e;
}

.risk-badge-moderate{
  background:#fff1d6;
  color:#a56a00;
}

.risk-badge-high{
  background:#ffe0de;
  color:#b42318;
}

/* =========================================================
   14. LANDING PAGE
========================================================= */

#appShell{
  display:none;
}

#landingScreen{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px 44px;
  background:radial-gradient(circle at top,#eef5ff 0%,#dde7f5 45%,#d7e0ec 100%);
}

#landingScreen .landing-page{
  width:100%;
  max-width:1500px;
  margin:0 auto;
}

#landingScreen .landing-hero{
  text-align:center;
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:34px;
  min-height:88vh;
  padding:46px 64px 34px;
  box-shadow:0 12px 30px rgba(15,23,42,.07);
}

#landingScreen .landing-hero h1{
  margin:0;
  font-size:82px;
  line-height:1;
  letter-spacing:-.04em;
}

#landingScreen .landing-hero h1 span{
  color:#10233f;
}

#landingScreen .landing-hero h1 strong{
  color:#2387f5;
}

#landingScreen .landing-hero h2{
  font-size:32px;
  max-width:950px;
  margin:20px auto 12px;
  color:#10233f;
}

#landingScreen .landing-hero > p{
  max-width:920px;
  margin:0 auto;
  font-size:18px;
  line-height:1.45;
  color:#506079;
}

#landingScreen .landing-framework{
  margin:26px auto 28px;
  max-width:1000px;
  text-align:center;
}

#landingScreen .landing-framework-label{
  font-size:13px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#5b6b82;
  margin-bottom:14px;
}

#landingScreen .landing-framework-pills{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:14px;
}

#landingScreen .framework-pill{
  padding:9px 18px;
  border-radius:999px;
  font-size:13px;
  font-weight:800;
  background:#eef4ff;
  color:#2459cc;
  border:1px solid #cfe0f7;
}

#landingScreen .landing-framework-text{
  max-width:760px;
  margin:0 auto;
  font-size:16px;
  line-height:1.45;
  color:#64748b;
}

#landingScreen .landing-pillars{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  max-width:1260px;
  margin:28px auto 26px;
}

#landingScreen .landing-pillar{
  position:relative;
  display:flex;
  align-items:center;
  gap:22px;
  min-height:168px;
  padding:26px 32px;
  text-align:left;
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:24px;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

#landingScreen .pillar-icon{
  flex:0 0 70px;
  width:70px;
  height:70px;
  border-radius:50%;
  background:#eef4ff;
  color:#2563eb;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  font-weight:900;
}

#landingScreen .pillar-content h3{
  margin:0 0 8px;
  font-size:24px;
  line-height:1.15;
  color:#123f75;
}

#landingScreen .pillar-content p{
  margin:0;
  font-size:15px;
  line-height:1.45;
  color:#52637c;
}

#landingScreen .live-pillar{
  border-color:#93c5fd;
  background:linear-gradient(135deg,#ffffff 0%,#eff6ff 100%);
}

#landingScreen .live-badge-small{
  position:absolute;
  top:18px;
  right:20px;
  background:#2563eb;
  color:#fff;
  border-radius:8px;
  padding:5px 9px;
  font-size:11px;
  font-weight:900;
}

#landingScreen .landing-steps{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:18px;
  max-width:1360px;
  margin:0 auto 26px;
}

#landingScreen .landing-step{
  min-height:170px;
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:20px;
  padding:24px 14px;
  text-align:center;
  box-shadow:0 5px 16px rgba(15,23,42,.05);
}

#landingScreen .landing-step-number{
  width:44px;
  height:44px;
  margin:0 auto 12px;
  border-radius:50%;
  background:#2563eb;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:900;
}

#landingScreen .landing-step h3{
  margin:0 0 8px;
  font-size:16px;
  color:#123f75;
}

#landingScreen .landing-step p{
  margin:0;
  font-size:13px;
  line-height:1.4;
  color:#52637c;
}

#landingScreen .landing-enter{
  margin-top:4px;
  font-size:18px;
  padding:16px 38px;
  border-radius:16px;
}

#landingScreen .landing-tagline{
  margin-top:12px;
  font-size:16px;
  color:#475569;
  font-weight:700;
}

@media(max-width:1100px){
  #landingScreen .landing-pillars,
  #landingScreen .landing-steps{
    grid-template-columns:1fr;
  }
}
/* Make 7 workflow steps secondary and aligned under pillars */

#landingScreen .landing-steps{
  display:grid !important;
  grid-template-columns:repeat(7,1fr) !important;
  gap:12px !important;
  max-width:1260px !important;
  margin:0 auto 24px !important;
}

#landingScreen .landing-step{
  min-height:138px !important;
  padding:18px 10px !important;
  border-radius:18px !important;
}

#landingScreen .landing-step-number{
  width:38px !important;
  height:38px !important;
  font-size:16px !important;
  margin:0 auto 10px !important;
}

#landingScreen .landing-step h3{
  font-size:14px !important;
  line-height:1.15 !important;
  margin:0 0 7px !important;
}

#landingScreen .landing-step p{
  font-size:11.5px !important;
  line-height:1.35 !important;
  margin:0 !important;
}
#landingScreen .landing-hero h2{
  max-width:980px !important;
  margin:20px auto 12px !important;
  text-align:center !important;
  line-height:1.18 !important;
}

#landingScreen{
  min-height:100vh !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:18px 44px 28px !important;
  overflow-y:auto !important;
}

#landingScreen .landing-hero{
  min-height:auto !important;
  padding:34px 64px 28px !important;
}

#landingScreen .landing-framework{
  margin:20px auto 22px !important;
}

#landingScreen .landing-pillars{
  margin:22px auto 20px !important;
}

#landingScreen .landing-steps{
  margin:0 auto 18px !important;
}

#landingScreen .landing-enter{
  margin-top:0 !important;
}

/* TOP LANDING NAV */

.landing-top-nav{
  display:flex;
  justify-content:space-between;
  align-items:center;

  margin-bottom:24px;
  padding:0 8px;
}

.landing-brand-small{
  font-size:20px;
  font-weight:800;
  color:#1f2f46;
}

.landing-top-nav-right{
  display:flex;
  align-items:center;
  gap:28px;
}

.landing-top-nav-right a{
  text-decoration:none;
  color:#475569;
  font-weight:700;
  transition:.2s;
}

.landing-top-nav-right a:hover{
  color:#2563eb;
}

/* =========================================================
   15. RESPONSIVE RULES
========================================================= */
@media(max-width:1200px){

  .team-dashboard-hero{
    grid-template-columns:1fr;
  }

  .dashboard-hero-metrics{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:700px){

  .dashboard-hero-top{
    flex-direction:column;
  }

  .dashboard-hero-top h2{
    font-size:34px;
  }

  .dashboard-hero-metrics{
    grid-template-columns:1fr;
  }

}

@media(max-width:1100px){
  #landingScreen .landing-steps{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   16. TEAMFLOW V3 CLEAN OVERRIDES
========================================================= */

.team-dashboard-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:24px;
  align-items:stretch;
  margin-bottom:24px;
}

.dashboard-hero-main,
.dashboard-actions-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:28px;
  padding:28px;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.team-hero-header-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  gap:24px;
  align-items:start;
}

.team-hero-title-block h1{
  font-size:28px;
  line-height:1;
  margin:0;
  font-weight:800;
  color:#0f172a;
}

.team-hero-title-block h2{
  font-size:18px;
  margin:8px 0 0;
  color:#334155;
}

.team-hero-title-block h3{
  font-size:14px;
  margin:6px 0 0;
  font-weight:500;
  color:#64748b;
}

.dashboard-progress-circle{
  width:150px;
  height:150px;
  min-width:150px;
  justify-self:end;
}

.dashboard-hero-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-top:24px;
}

.hero-metric-card{
  min-height:110px;
  padding:18px;
  border-radius:18px;
  background:#ffffff;
  border:1px solid #dbe4f0;
}

.dashboard-main-row{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(320px,1fr);
  gap:18px;
  align-items:start;
}

.dashboard-side-stack{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.dashboard-assignments-panel .assignment-card-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.dashboard-assignments-panel .assignment-premium-card{
  min-height:0;
  height:225px;
  padding:26px 36px;
}

@media(max-width:1100px){
  .team-dashboard-hero,
  .dashboard-main-row{
    grid-template-columns:1fr;
  }

  .dashboard-hero-metrics,
  .dashboard-assignments-panel .assignment-card-grid{
    grid-template-columns:1fr;
  }

  .dashboard-progress-circle{
    justify-self:start;
  }
}

/* MY DASHBOARD HERO RESTORE */

.dashboard-personal-hero.dashboard-hero-clean{
  display:block !important;
  grid-template-columns:1fr 1fr 1fr !important;
  gap:18px !important;
  align-items:stretch !important;

  background:#ffffff !important;
  border:1px solid #dbe4f0 !important;
  border-radius:24px !important;
  padding:28px 34px !important;
  box-shadow:0 10px 24px rgba(15,23,42,.05) !important;
  margin-bottom:18px !important;
}

.dashboard-personal-left,
.dashboard-deadlines-card,
.dashboard-focus-panel{
  min-width:0 !important;
}

.dashboard-personal-left h1{
  font-size:34px !important;
  line-height:1.05 !important;
  margin:8px 0 16px !important;
  color:#1f2f46 !important;
}

.dashboard-personal-left p{
  margin:0 !important;
  font-weight:700 !important;
  color:#334155 !important;
  line-height:1.35 !important;
}

.dashboard-deadlines-card,
.dashboard-focus-panel{
  height:100% !important;
  background:#ffffff !important;
  border:1px solid #dbe4f0 !important;
  border-radius:22px !important;
  padding:24px !important;
}

.dashboard-deadlines-card > span,
.dashboard-focus-panel > span{
  display:block !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#64748b !important;
  margin-bottom:14px !important;
}

.hero-deadline-item{
  padding:12px 14px !important;
  border:1px solid #dbe4f0 !important;
  border-radius:14px !important;
  background:#f8fbff !important;
  margin-bottom:10px !important;
}

.hero-deadline-item strong{
  display:block !important;
  font-size:15px !important;
  color:#1f2f46 !important;
}

.hero-deadline-item small{
  display:block !important;
  margin-top:4px !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:#64748b !important;
}

.hero-deadline-item.primary strong{
  font-size:20px !important;
  color:#2563eb !important;
}

.dashboard-focus-panel strong{
  display:block !important;
  font-size:22px !important;
  color:#0f172a !important;
  margin-bottom:14px !important;
}

.dashboard-focus-panel p{
  color:#475569 !important;
  line-height:1.55 !important;
  margin:0 0 18px !important;
}

.dashboard-focus-note{
  padding:12px 14px !important;
  border-radius:12px !important;
  background:#eef6ff !important;
  color:#1f4e79 !important;
  font-weight:700 !important;
  font-size:13px !important;
}

@media(max-width:800px){
  .dashboard-personal-hero.dashboard-hero-clean{
    grid-template-columns:1fr !important;
  }
}

/* MY DASHBOARD HERO */

.dashboard-personal-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  gap:24px;
  align-items:stretch;
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:28px;
  padding:30px 34px;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}

.dashboard-personal-left h1{
  margin:10px 0 14px;
  font-size:38px;
  line-height:1.05;
  color:#1f2f46;
  font-weight:650;
}

.dashboard-hero-status-row{
  gap:14px;
  margin-top:22px;
  flex-wrap:wrap;
}

.dashboard-hero-status-row div{
  min-width:145px;
  padding:14px 16px;
  border-radius:16px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
}

.dashboard-hero-status-row span{
  display:block;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:6px;
}

.dashboard-hero-status-row strong{
  font-size:18px;
  color:#1f2f46;
}

.dashboard-focus-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-left:6px solid #2563eb;
  border-radius:22px;
  padding:24px;
}

.dashboard-focus-meta{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:18px;
}

.dashboard-focus-meta div{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:16px;
  padding:14px;
  text-align:center;
}

.dashboard-focus-meta b{
  display:block;
  font-size:26px;
  color:#2563eb;
}

.dashboard-focus-meta small{
  font-size:11px;
  font-weight:800;
  color:#64748b;
}

@media(max-width:1000px){
  .dashboard-personal-hero{
    grid-template-columns:1fr;
  }
}

/* MY DASHBOARD SIDE PANELS POLISH */

.dashboard-tasks-panel,
.dashboard-project-health{
  border-radius:22px;
  padding:22px;
}

.dashboard-tasks-panel h3,
.dashboard-project-health h3{
  margin-bottom:16px;
}

.dashboard-tasks-panel .task-card,
.dashboard-tasks-panel .task-card-modern{
  padding:16px 18px;
  border-radius:18px;
  border-left:6px solid #94a3b8;
  box-shadow:none;
  margin-bottom:10px;
}

.dashboard-tasks-panel .task-card-title-wrap h3{
  font-size:15px !important;
  margin-bottom:8px !important;
}

.dashboard-tasks-panel .task-card p,
.dashboard-tasks-panel .task-card span{
  font-size:13px;
  color:#64748b;
}

.project-health-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:11px 0;
  border-bottom:1px solid #edf1f7;
}

.project-health-row:last-child{
  border-bottom:none;
}

.project-health-row span{
  color:#64748b;
  font-weight:700;
}

.project-health-row strong{
  color:#0f172a;
  font-weight:900;
}

.dashboard-project-health .progress{
  margin:6px 0 12px;
  height:9px;
  background:#e5eaf2;
  border-radius:999px;
  overflow:hidden;
}

.dashboard-project-health .bar{
  height:100%;
  background:#2563eb;
  border-radius:999px;
}

.clickable-card{
  cursor:pointer;
}

.clickable-card:hover{
  transform:translateY(-3px);
}

.dashboard-task-clickable{
  cursor:pointer;
  transition:all .2s ease;
}

.dashboard-task-clickable:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(15,23,42,.12);
}

.dashboard-task-clickable small{
  display:block;
  margin-top:10px;
  color:#2563eb;
  font-weight:800;
}

.dashboard-task-header{
  display:flex;
  justify-content:flex-end;
  margin-bottom:12px;
}

.dashboard-task-total{
  background:#eef4ff;
  color:#2563eb;
  padding:6px 12px;
  border-radius:999px;
  font-size:.85rem;
  font-weight:700;
}

.dashboard-view-all{
  text-align:center;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid #e5e7eb;
  color:#2563eb;
  font-weight:700;
  cursor:pointer;
}

.dashboard-view-all:hover{
  text-decoration:underline;
}

.project-health-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}

.project-health-badge{
  padding:6px 12px;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
}

.project-health-badge.low{
  background:#dcfce7;
  color:#15803d;
}

.project-health-badge.moderate{
  background:#fef3c7;
  color:#b45309;
}

.project-health-badge.high{
  background:#fee2e2;
  color:#b91c1c;
}

.project-health-metric{
  display:flex;
  justify-content:space-between;
  margin-bottom:10px;
}

.project-health-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:18px;
}

.project-health-stats div{
  text-align:center;
}

.project-health-stats strong{
  display:block;
  font-size:1.1rem;
}

.project-health-stats span{
  font-size:.8rem;
  color:#64748b;
}

.project-health-guidance{
  margin-top:18px;
  padding:12px;
  border-radius:12px;
  background:#f8fafc;
  font-size:.9rem;
}

.dashboard-hero-health-mini{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.mini-health-row{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:14px;
  padding:12px 14px;
}

.mini-health-row span{
  display:block;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:5px;
}

.mini-health-row strong{
  font-size:16px;
  font-weight:900;
  color:#0f172a;
}

.dashboard-personal-left h1{
  margin-bottom:18px;
}

.dashboard-context-card{
  margin-top:6px;
}

.dashboard-context-card .context-chip{
  margin-bottom:10px;
}

.dashboard-context-card h3{
  margin:0 0 8px;
  line-height:1.3;
}

.dashboard-context-team{
  margin-top:10px;
}

.dashboard-personal-left .dashboard-hero-status-row{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
}

.dashboard-personal-left .dashboard-hero-status-row > div{
  width:100% !important;
  min-width:0 !important;
}

.dashboard-priority-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}

.dashboard-assignment-list,
.dashboard-task-summary{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.dashboard-priority-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:16px;
  border:1px solid #dbe4f0;
  border-radius:16px;
  background:#f8fbff;
  cursor:pointer;
}

.dashboard-priority-item.primary{
  border-left:6px solid #2563eb;
  background:#eef5ff;
}

.dashboard-priority-item strong{
  display:block;
  color:#10233f;
  font-size:16px;
}

.dashboard-priority-item span{
  display:block;
  margin-top:4px;
  color:#64748b;
  font-weight:700;
  font-size:13px;
}

.dashboard-task-summary{
  padding:18px;
  border-radius:18px;
  border:1px solid #dbe4f0;
  background:#ffffff;
}

.dashboard-task-summary .task-card{
  padding:14px 16px;
  margin-bottom:10px;
  box-shadow:none;
}

@media(max-width:1000px){
  .dashboard-priority-grid{
    grid-template-columns:1fr;
  }
}

.dashboard-personal-hero.dashboard-hero-clean{
  display:grid !important;
  grid-template-columns: 1fr 1.2fr 1fr !important;
  gap:18px !important;
  align-items:stretch !important;
}

.dashboard-priority-grid{
  display:grid !important;
  grid-template-columns: 1.4fr 1fr !important;
  gap:18px !important;
  align-items:start !important;
}

.dashboard-hero-status-row{
  display:grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap:10px !important;
}

.dashboard-task-summary{
  max-height:560px;
  overflow:hidden;
}

.dashboard-task-summary .task-card-modern:nth-of-type(n+3),
.dashboard-task-summary .task-card:nth-of-type(n+3){
  display:none;
}

.dashboard-assignment-insight{
  margin-top:14px;
  padding:16px;
  border-radius:18px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
}

.dashboard-assignment-insight h4{
  margin:0 0 8px;
  color:#173f66;
  font-size:15px;
}

.dashboard-assignment-insight p{
  margin:0 0 14px;
  color:#475569;
  line-height:1.45;
}

.assignment-insight-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.assignment-insight-grid div{
  padding:12px;
  border-radius:14px;
  background:#ffffff;
  border:1px solid #dbe4f0;
}

.assignment-insight-grid span{
  display:block;
  font-size:11px;
  font-weight:900;
  color:#64748b;
  text-transform:uppercase;
}

.assignment-insight-grid strong{
  display:block;
  margin-top:4px;
  font-size:18px;
}

.dashboard-personal-hero.dashboard-hero-clean{
  display:grid !important;
  grid-template-columns:1fr 1.15fr 1fr !important;
  gap:24px !important;
  align-items:start !important;
}

/* ==========================================
   DASHBOARD ASSIGNMENTS & DEADLINES SPACING
   ========================================== */

.dashboard-hero-middle{
  display:flex;
  flex-direction:column;
  gap:20px;
  align-self:stretch;
}

.dashboard-hero-middle h3{
  margin-bottom:4px;
}

.dashboard-priority-item{
  padding:18px 20px;
  min-height:72px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  border-radius:16px;
  transition:all .2s ease;
}

.dashboard-priority-item:hover{
  transform:translateY(-2px);
}

.dashboard-priority-item strong{
  display:block;
  margin-bottom:6px;
  font-size:1.1rem;
}

.dashboard-priority-item span{
  display:block;
  line-height:1.4;
}

.dashboard-priority-item .btn{
  flex-shrink:0;
  margin-left:20px;
}

.dashboard-hero-middle{
  min-height:420px;
}

/* ==========================================
   DASHBOARD CURRENT FOCUS / TASKS SPACING
   ========================================== */

.dashboard-assignment-insight{
  display:flex;
  flex-direction:column;
  gap:16px;
  align-self:stretch;
}

.dashboard-assignment-insight h4,
.dashboard-assignment-insight h3{
  margin:0;
}

.dashboard-assignment-insight p{
  margin:0;
  line-height:1.45;
}

.assignment-insight-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:4px;
}

.assignment-insight-grid > div{
  padding:18px 20px;
  min-height:72px;
  border-radius:16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.dashboard-assignment-insight .task-card{
  padding:18px 20px;
  min-height:96px;
  border-radius:16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
}

.dashboard-assignment-insight .task-card strong,
.dashboard-assignment-insight .task-card p,
.dashboard-assignment-insight .task-card small{
  margin:0;
}

.dashboard-assignment-insight .dashboard-view-all{
  margin-top:2px;
  padding-top:14px;
}

/* ==========================================
   CURRENT FOCUS HEADER OUTSIDE PANEL
   ========================================== */

.dashboard-assignment-insight-wrap{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.dashboard-assignment-insight-wrap > h3{
  margin:0;
  padding-left:4px;
  color:var(--tf-navy);
}

.dashboard-assignment-insight{
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* FINAL DASHBOARD HERO ALIGNMENT FIX */

.dashboard-personal-hero.dashboard-hero-clean{
  display:grid !important;
  grid-template-columns:1fr 1.15fr 1fr !important;
  gap:24px !important;
  align-items:start !important;
}

.dashboard-hero-left,
.dashboard-hero-middle,
.dashboard-assignment-insight-wrap{
  align-self:start !important;
  margin-top:0 !important;
  padding-top:0 !important;
}

.dashboard-hero-middle,
.dashboard-assignment-insight-wrap{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
}

.dashboard-hero-middle > h3,
.dashboard-assignment-insight-wrap > h3{
  margin:0 0 0 0 !important;
  padding:0 !important;
  line-height:1.2 !important;
  min-height:22px !important;
}

.dashboard-priority-item:first-of-type,
.dashboard-assignment-insight{
  margin-top:0 !important;
}

.dashboard-assignment-insight{
  padding:18px 20px !important;
}

/* ==========================================
   STUDENT DASHBOARD V2 - 2 ROW / 3 COLUMN
   ========================================== */

.student-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}

.dashboard-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:24px;
  padding:24px;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.dashboard-panel h3{
  margin:0 0 16px !important;
  color:#173f66 !important;
}

.dashboard-welcome-panel h1{
  margin:8px 0 18px;
  font-size:34px;
  line-height:1.05;
  color:#1f2f46;
  font-weight:600;
}

.dashboard-welcome-panel{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.dashboard-focus-panel-v2{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.dashboard-focus-card{
  padding:18px 20px;
  border-radius:18px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
}

.dashboard-focus-card strong{
  display:block;
  font-size:18px;
  color:#10233f;
  margin-bottom:8px;
}

.dashboard-focus-card p{
  margin:0 0 16px;
  color:#475569;
  line-height:1.45;
}

.dashboard-quick-actions-panel{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.dashboard-action-button{
  width:100%;
  display:flex;
  align-items:center;
  gap:14px;
  text-align:left;
  border:1px solid #dbe4f0;
  background:#f8fbff;
  border-radius:18px;
  padding:16px;
  cursor:pointer;
  transition:all .2s ease;
}

.dashboard-action-button:hover{
  transform:translateY(-2px);
  background:#eef5ff;
  border-color:#bcd2f5;
}

.dashboard-action-button span{
  width:42px;
  height:42px;
  border-radius:14px;
  background:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  flex-shrink:0;
}

.dashboard-action-button strong{
  display:block;
  color:#10233f;
  font-size:15px;
  margin-bottom:4px;
}

.dashboard-action-button small{
  display:block;
  color:#64748b;
  line-height:1.35;
}

.dashboard-progress-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid #edf1f7;
}

.dashboard-progress-row:last-child{
  border-bottom:none;
}

.dashboard-progress-row span{
  color:#64748b;
  font-weight:700;
}

.dashboard-progress-row strong{
  color:#10233f;
  font-weight:900;
}

.dashboard-soft-note{
  margin-top:16px;
  padding:14px;
  border-radius:14px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
  color:#475569;
  line-height:1.45;
  font-weight:700;
}

.dashboard-activity-preview{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.dashboard-activity-preview div{
  padding:14px 16px;
  border-radius:16px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
}

.dashboard-activity-preview strong{
  display:block;
  color:#10233f;
  margin-bottom:5px;
}

.dashboard-activity-preview span{
  display:block;
  color:#64748b;
  font-size:13px;
  line-height:1.4;
}

@media(max-width:1200px){
  .student-dashboard-grid{
    grid-template-columns:1fr;
  }
}

/* ==========================================
   STUDENT DASHBOARD 3 x 2 GRID
   ========================================== */

.student-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:24px;
  align-items:stretch;
}

.dashboard-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:24px;
  padding:24px;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
  min-height:360px;
}

.dashboard-panel h3{
  margin:0 0 16px;
}

.dashboard-welcome-panel h1{
  margin:10px 0 18px;
  font-size:34px;
  line-height:1.05;
  color:#1f2f46;
  font-weight:600;
}

.dashboard-focus-card{
  padding:18px;
  border-radius:18px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
  margin-bottom:20px;
}

.dashboard-focus-card strong{
  display:block;
  font-size:18px;
  color:#10233f;
  margin-bottom:8px;
}

.dashboard-focus-card p{
  margin:0 0 16px;
  color:#475569;
  line-height:1.45;
}

.dashboard-action-button{
  width:100%;
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  margin-bottom:0;
  border:1px solid #dbe4f0;
  border-radius:16px;
  background:#f8fbff;
  text-align:left;
  cursor:pointer;
}

.dashboard-action-button:hover{
  background:#eef5ff;
  transform:translateY(-2px);
}

.dashboard-action-button span{
  font-size:24px;
}

.dashboard-action-button strong{
  display:block;
  color:#10233f;
  margin-bottom:4px;
}

.dashboard-action-button small{
  color:#64748b;
  font-weight:700;
}

.dashboard-progress-row{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:12px 0;
  border-bottom:1px solid #edf1f7;
}

.dashboard-progress-row span{
  color:#64748b;
  font-weight:700;
}

.dashboard-progress-row strong{
  color:#0f172a;
  font-weight:900;
}

.dashboard-soft-note{
  margin-top:18px;
  padding:14px;
  border-radius:14px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
  color:#475569;
  font-weight:700;
}

.dashboard-activity-preview{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.dashboard-activity-preview div{
  padding:14px;
  border-radius:14px;
  background:#f8fbff;
  border:1px solid #dbe4f0;
}

.dashboard-activity-preview strong{
  display:block;
  color:#10233f;
  margin-bottom:5px;
}

.dashboard-activity-preview span{
  color:#64748b;
  font-weight:700;
  line-height:1.4;
}

@media(max-width:1200px){
  .student-dashboard-grid{
    grid-template-columns:1fr;
  }
}

.dashboard-action-button span{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:14px;
  background:#eef5ff;
  color:#2563eb;
  display:flex;
  align-items:center;
  justify-content:center;
}

.dashboard-action-button span svg{
  width:22px;
  height:22px;
  stroke-width:2.4;
}

.dashboard-context-card{
  padding-bottom:20px;
  margin-bottom:20px;
  border-bottom:1px solid #e5eaf2;
}

.dashboard-context-card{
  padding-bottom:12px;
  margin-bottom:14px;
  border-bottom:1px solid #e5eaf2;
}

.dashboard-welcome-panel h3{
  margin-top:0;
}

.dashboard-context-card{
  padding-bottom:26px;
  margin-bottom:22px;
  border-bottom:1px solid #dbe4f0;
}

.dashboard-section-divider{
  display:none !important;
}

.dashboard-section-divider::before,
.dashboard-section-divider::after{
  content:none !important;
  display:none !important;
}

.dashboard-full-width-btn{
  width:100%;
  margin-top:12px;
}

.presence-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  display:inline-block;
  margin-right:8px;
}

.presence-dot.online{
  background:#22c55e;
}

.presence-dot.away{
  background:#f59e0b;
}

.presence-dot.offline{
  background:#cbd5e1;
}

/* TEAM PRESENCE PANEL */

.dashboard-presence-panel{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.team-presence-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.team-presence-user{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid #dbe4f0;
  border-radius:14px;
  background:#f8fbff;
}

.team-presence-user strong{
  display:block;
  color:#10233f;
  font-size:14px;
}

.team-presence-user small{
  display:block;
  margin-top:2px;
  color:#64748b;
  font-size:12px;
  font-weight:700;
}

.presence-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  flex-shrink:0;
}

.presence-dot.online{
  background:#16a34a;
  box-shadow:0 0 0 4px rgba(22,163,74,.12);
}

.presence-dot.away{
  background:#f59e0b;
  box-shadow:0 0 0 4px rgba(245,158,11,.14);
}

.presence-dot.offline{
  background:#94a3b8;
  box-shadow:0 0 0 4px rgba(148,163,184,.14);
}

.dashboard-heading-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#2563eb;
  display:inline-block;
  flex-shrink:0;
}

.card-title-with-icon{
  display:flex;
  align-items:center;
  gap:10px;
}

.dashboard-right-stack{
  display:flex;
  flex-direction:column;
  gap:18px;
  min-width:0;
}

.dashboard-soft-note{
  margin-top:14px;
  padding:10px 12px;

  background:#f8fafc;
  border-radius:10px;

  font-size:12px;
  font-weight:600;
  color:#64748b;

  text-align:center;
}

.student-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:start;
}

.dashboard-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:22px;
  padding:22px;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}

.dashboard-panel h3.card-title-with-icon{
  margin-bottom:16px;
}

.dashboard-quick-actions-panel,
.dashboard-presence-panel{
  grid-column:3;
}

.dashboard-presence-panel{
  grid-row:1;
}

.dashboard-quick-actions-panel{
  grid-row:2;
}

.dashboard-full-width-btn{
  width:100%;
  margin-top:12px;
}

.dashboard-presence-note{
  margin-top:14px;
  padding:12px 14px;
  border-radius:14px;
  background:#eef5ff;
  color:#1d4ed8;
  font-size:13px;
  font-weight:800;
  border:1px solid #cfe0f7;
}

.card-title-with-icon .tf-icon-heading{
  color:#2563eb !important;
  stroke:#2563eb !important;
}

@media(max-width:1100px){
  .student-dashboard-grid{
    grid-template-columns:1fr;
  }

  .dashboard-quick-actions-panel,
  .dashboard-presence-panel{
    grid-column:auto;
    grid-row:auto;
  }
}

.dashboard-side-column{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.dashboard-presence-note{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(148,163,184,0.25);
  font-size:13px;
  color:#64748b;
  font-weight:500;
}

.student-dashboard-grid{
  align-items: stretch;
}

.student-dashboard-grid > .dashboard-panel,
.student-dashboard-grid > .dashboard-side-column{
  height: 100%;
}

.dashboard-side-column{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* ==========================================
   WORKFLOW BOARD
========================================== */

.workflow-board-header{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-bottom:24px;
}

.workflow-summary-card{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:18px;
  padding:18px;
}

.workflow-summary-card span{
  display:block;
  font-size:12px;
  font-weight:800;
  color:#64748b;
  text-transform:uppercase;
}

.workflow-summary-card strong{
  display:block;
  margin-top:8px;
  font-size:32px;
}

.workflow-board-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  align-items:start;
}

.workflow-column{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:20px;
  padding:16px;
  min-height:600px;
}

.workflow-column-header{
  margin-bottom:16px;
}

.workflow-column-header h3{
  margin:0;
}

.workflow-column-header span{
  color:#64748b;
  font-size:13px;
  font-weight:700;
}

.workflow-column-body{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.workflow-task-card{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:14px;
  padding:14px;
  box-shadow:0 2px 6px rgba(15,23,42,.05);
}

.workflow-task-card strong{
  display:block;
  margin-bottom:8px;
}

.workflow-task-card small{
  display:block;
  color:#64748b;
  margin-bottom:10px;
}

.workflow-task-status{
  font-size:12px;
  font-weight:800;
  color:#2563eb;
}

.workflow-board-grid,
.task-workflow-board-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 24px;
}

.workflow-column,
.task-workflow-column {
  background: #f8fafc;
  border: 1px solid #dbe4f0;
  border-radius: 18px;
  padding: 16px;
  min-height: 260px;
}

.workflow-column-header,
.task-workflow-column-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.workflow-column-header h3,
.task-workflow-column-header h3 {
  margin: 0;
  font-size: 16px;
}

.workflow-task-card,
.task-workflow-card {
  background: white;
  border: 1px solid #dbe4f0;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 12px;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.06);
}

.workflow-task-card small,
.task-workflow-card small {
  display: block;
  margin-top: 6px;
  color: #64748b;
}

.workflow-task-status,
.task-workflow-status {
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
}

.workflow-board-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 16px;
  align-items: stretch;
  width: 100%;
}

.workflow-board-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 16px;
  align-items: stretch;
  margin-top: 18px;
}

.workflow-column {
  background: #ffffff;
  border: 1px solid #d7e2f0;
  border-radius: 18px;
  padding: 16px;
  min-height: 260px;
}

.workflow-column-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.workflow-column-header h3 {
  margin: 0;
  font-size: 16px;
}

.workflow-column-header span {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
}

.workflow-task-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 10px;
}

.workflow-task-card strong {
  display: block;
  margin-bottom: 6px;
}

.workflow-task-card small {
  display: block;
  color: #64748b;
  margin-bottom: 8px;
}

.workflow-task-status {
  font-size: 12px;
  font-weight: 700;
}

.task-workflow-board{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:16px;
  margin-top:24px;
}

.task-workflow-column{
  background:#ffffff;
  border:1px solid #e5e7eb;
}

.task-workflow-board{
  display:grid;
  grid-template-columns:repeat(5,minmax(220px,1fr));
  gap:16px;
  align-items:start;
}

.task-workflow-column-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
}

.task-workflow-column-body{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.task-board-mini-card{
  background:white;
  border:1px solid #dbe5f3;
  border-radius:14px;
  padding:14px;
  box-shadow:0 8px 18px rgba(15,23,42,.06);
}

.task-board-mini-meta{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:8px;
  font-size:12px;
}

.task-board-empty{
  color:#64748b;
  font-size:13px;
}

.tool-frame{
  width:100%;
  height:85vh;
  border:none;
  border-radius:12px;
}

/* ===== TEAMFLOW KANBAN STAGES ===== */

.stage-engage .kanban-column-header{
  border-top: 5px solid #14b8a6;
}

.stage-evaluate .kanban-column-header{
  border-top: 5px solid #3b82f6;
}

.stage-explore .kanban-column-header{
  border-top: 5px solid #8b5cf6;
}

.stage-expand .kanban-column-header{
  border-top: 5px solid #f59e0b;
}

.stage-execute .kanban-column-header{
  border-top: 5px solid #22c55e;
}

.kanban-column{
  background:#fff;
  border-radius:16px;
  box-shadow:0 2px 10px rgba(0,0,0,0.05);
  overflow:hidden;
}

.kanban-column-header{
  padding:14px 16px;
  background:#fafafa;
}

.kanban-column-header strong{
  display:block;
  font-size:15px;
  font-weight:700;
}

.kanban-column-header small{
  display:block;
  color:#6b7280;
  margin-top:4px;
}

.kanban-column-body{
  min-height:650px;
  padding:12px;
}

.kanban-task-card{
  background:white;
  border-radius:12px;
  padding:12px;
  margin-bottom:10px;
  cursor:pointer;
  transition:all .2s ease;
}

.kanban-task-card:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.kanban-task-meta{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:8px;
  font-size:12px;
  color:#666;
}

.kanban-insight-banner{
  background:#fff8e6;
  border-left:5px solid #f59e0b;
  padding:16px 20px;
  border-radius:12px;
  margin-bottom:20px;
}

.kanban-insight-banner strong{
  display:block;
  margin-bottom:6px;
  color:#92400e;
}

.kanban-insight-banner p{
  margin:0;
  color:#78350f;
}

.kanban-insight-banner.positive{
  background:#ecfdf5;
  border-left:5px solid #10b981;
}

.kanban-insight-banner.positive strong{
  color:#065f46;
}

.kanban-insight-banner.positive p{
  color:#047857;
}

.kanban-stage-stats{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kanban-stage-stats small{
  color:#64748b;
  font-size:11px;
}

.kanban-stage-stats strong{
  font-size:18px;
}

.kanban-stage-stats{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kanban-stage-stats small{
  color:#64748b;
  font-size:11px;
}

.kanban-stage-stats strong{
  font-size:18px;
}

.kanban-progress-bar{
  height:8px;
  background:#e5e7eb;
  border-radius:999px;
  margin-top:12px;
  overflow:hidden;
  grid-column:1 / -1;
}

.kanban-progress-fill{
  height:100%;
  background:#3b82f6;
  border-radius:999px;
}

.team-member-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;
}

.team-member-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:18px;
}

.simple-member-card{
  border-left:0;
}

.team-member-top{
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:18px;
}

.team-member-top h3{
  margin:0;
  font-size:18px;
}

.team-member-top p{
  margin:4px 0 0;
  color:#64748b;
  font-size:14px;
}

.team-member-avatar{
  width:46px;
  height:46px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  background:#e0f2fe;
  color:#0369a1;
}

.simple-member-detail{
  background:#f8fafc;
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.simple-member-detail strong{
  font-size:28px;
  color:#0f172a;
}

.simple-member-detail span{
  color:#64748b;
  font-size:14px;
}

.team-member-status,
.team-member-metrics{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
}

.team-member-metrics div{
  text-align:center;
}

.team-member-metrics span{
  display:block;
  font-size:12px;
  color:#64748b;
}

.member-strong{ border-left:6px solid #22c55e; }
.member-watch{ border-left:6px solid #f59e0b; }
.member-risk{ border-left:6px solid #ef4444; }


.team-role-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid #e5e7eb;
}

.team-role-row:last-child{
  border-bottom:0;
}

.team-role-row strong{
  color:#0f172a;
}

.team-role-row span{
  color:#475569;
}

.team-member-card {
  border: 1px solid #e5e7eb;
  border-left: 1px solid #e5e7eb;
  box-sizing: border-box;
}

.team-member-grid {
  padding-left: 4px;
}

.team-capacity-badge{
  background:#eef6ff;
  color:#1d4ed8;
  padding:8px 14px;
  border-radius:999px;
  font-weight:600;
  border:1px solid #dbeafe;
  white-space:nowrap;
}

.section-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}

.team-capacity-badge{
  background:#eef6ff;
  border:1px solid #cfe3ff;
  color:#1554d1;
  font-weight:700;
  font-size:13px;
  padding:8px 14px;
  border-radius:999px;
  white-space:nowrap;
}

.team-member-activity{
  font-size:12px;
  color:#64748b;
  margin-top:2px;
}

.team-member-activity{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:#64748b;
  margin-top:2px;
}

.team-member-activity::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22c55e;
}

.team-member-activity{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:0.82rem;
  color:#64748b;
  margin-top:4px;
}

.activity-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  display:inline-block;
}

.activity-dot.active-now{
  background:#22c55e;
}

.activity-dot.active-earlier{
  background:#f59e0b;
}

.activity-dot.inactive{
  background:#ef4444;
}

.member-status{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  font-size:0.75rem;
  font-weight:600;
  margin-top:6px;
}

.member-status.online{
  background:#dcfce7;
  color:#166534;
}

.member-status.recent{
  background:#fef3c7;
  color:#92400e;
}

.member-status.inactive{
  background:#fee2e2;
  color:#991b1b;
}

.member-contribution{
  margin-top:6px;
  font-size:13px;
  font-weight:600;
}

.team-member-info{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.member-contribution{
  margin-top:6px;
  font-size:13px;
  font-weight:600;
  color:#334155;
}

.team-member-info{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.team-member-info h3{
  margin:0 0 6px 0;
}

.member-contribution{
  margin-top:4px;
  font-size:13px;
  font-weight:600;
  color:#334155;
}

.simple-member-card .team-member-top{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  gap:14px;
  text-align:left;
}

.simple-member-card .team-member-info{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
}

.simple-member-card .team-member-info h3{
  margin:0 0 8px 0;
  text-align:left;
}

.simple-member-card .member-status,
.simple-member-card .member-contribution{
  align-self:flex-start;
  text-align:left;
}

.team-member-card .team-member-top{
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
}

.team-member-card .team-member-avatar{
  flex: 0 0 46px !important;
}

.team-member-card .team-member-info{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.team-member-card .team-member-info h3{
  margin: 0 0 8px 0 !important;
  line-height: 1.2 !important;
}

.member-status{
  display: inline-block !important;
  margin-bottom: 4px !important;
}

.member-contribution{
  font-size: 13px !important;
  font-weight: 700 !important;
}

.simple-member-card{
  text-align: left !important;
}

.simple-member-card .team-member-top{
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

.simple-member-card .team-member-info{
  text-align: left !important;
  align-items: flex-start !important;
}

.simple-member-card .member-status,
.simple-member-card .member-contribution{
  align-self: flex-start !important;
}

.team-member-top {
  display: grid !important;
  grid-template-columns: 52px 1fr !important;
  align-items: start !important;
  gap: 14px !important;
}

.team-member-info h3 {
  margin: 0 0 8px 0 !important;
}

.member-status,
.member-contribution {
  display: block !important;
  width: fit-content !important;
  margin-top: 4px !important;
}

.team-member-name-row {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
}

.team-member-name-row h3 {
  margin: 0 !important;
  line-height: 1.2 !important;
}

.team-member-meta {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  margin-left: 66px !important;
  margin-bottom: 18px !important;
}

.member-status,
.member-contribution {
  display: inline-flex !important;
  width: fit-content !important;
}

.simple-member-detail {
  margin-top: 0 !important;
}

.team-member-meta {
  margin-left: 66px !important;
  margin-top: -14px !important;
  margin-bottom: 18px !important;
}

.member-status-area{
  min-height:72px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:10px;
}

.member-status{
  width:fit-content;
}

.member-contribution{
  font-weight:600;
  color:#334155;
}

.team-member-name-row{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:54px;
}

.team-member-name-row h3{
  margin:0;
}

.member-status-area{
  min-height:72px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:10px;
  padding-left:58px;
}


.member-contribution{
  font-size:13px;
  font-weight:700;
  color:#1f2a44;
}

.team-member-top-clean{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:18px;
}

.team-member-info-clean{
  flex:1;
  min-width:0;
}


.team-member-name-line h3{
  margin:0;
  font-size:17px;
  line-height:1.2;
}

.member-contribution{
  margin-top:6px;
  font-size:13px;
  font-weight:700;
}

.team-member-top-clean{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:18px;
}

.team-member-info-clean h3{
  margin:0;
  font-size:22px;
  font-weight:700;
}

.member-activity-text{
  margin-top:4px;
  font-size:13px;
  color:#6b7280;
}

.member-contribution-text{
  margin-top:4px;
  font-size:14px;
  font-weight:600;
  color:#1f2a44;
}

/* =========================================================
   TEAM MEMBERS FINAL CLEAN OVERRIDE
========================================================= */

.team-member-card{
  padding:18px !important;
  text-align:left !important;
}

.team-member-top-clean{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  margin-bottom:22px !important;
}

.team-member-info-clean h3{
  margin:0 0 6px 0 !important;
  padding-top:2px !important;
  font-size:18px !important;
  line-height:1.2 !important;
  color:#173f66 !important;
}

.team-member-avatar{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  flex:0 0 46px !important;
}

.team-member-info-clean{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  text-align:left !important;
  min-width:0 !important;
}

.team-member-info-clean h3{
  margin:0 0 6px 0 !important;
  font-size:18px !important;
  line-height:1.2 !important;
  color:#173f66 !important;
}

.member-activity-text{
  margin:0 0 4px 0 !important;
  font-size:13px !important;
  font-weight:600 !important;
  color:#64748b !important;
  line-height:1.2 !important;
}

.member-contribution-text{
  margin:0 !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:#1f2a44 !important;
  line-height:1.2 !important;
}

.member-status{
  display:none !important;
}

.member-contribution{
  display:none !important;
}

.member-status-area,
.team-member-meta,
.team-member-name-row,
.team-member-name-line{
  display:none !important;
}

.simple-member-detail{
  margin-top:0 !important;
  margin-bottom:14px !important;
}

/* FINAL TEAM MEMBER ALIGNMENT FIX */

.team-member-top-clean{
  display:grid !important;
  grid-template-columns:46px 1fr !important;
  column-gap:14px !important;
  align-items:start !important;
  margin-bottom:22px !important;
}

.team-member-avatar{
  margin-top:0 !important;
}

.team-member-info-clean{
  padding-top:0 !important;
}

.team-member-info-clean h3{
  margin:0 0 4px 0 !important;
  padding:0 !important;
  line-height:46px !important;
  font-size:18px !important;
}

.nav-section.burgundy h2{
  color:#7a1f3d;
}

.nav-section.burgundy{
  border-left:4px solid #7a1f3d;
}

.nav-section.admin h2{
  color:#1a1a1a;
}

.nav-section.admin{
  border-left:4px solid #1a1a1a;
}

.nav-section.teal h2{
  color:#14b8a6;
}

.nav-section.blue h2{
  color:var(--blue2);
}

.nav-section.green h2{
  color:var(--green);
}

.nav-section.purple h2{
  color:var(--purple);
}

.nav-section.orange h2{
  color:var(--orange);
}

.nav-section.red h2{
  color:var(--red);
}

/* FINAL TYPOGRAPHY SCALE OVERRIDE */

#page-title{

  font-size:40px !important;
  font-weight:650 !important;
  line-height:1.12 !important;
  letter-spacing:-0.01em !important;
}

#page-subtitle{
  font-size:16px !important;
  line-height:1.45 !important;
  color:#506079 !important;
}

.topbar h2{

  font-size:40px !important;
  font-weight:600 !important;
  line-height:1.12 !important;
}

.topbar p{
  font-size:16px !important;
  line-height:1.45 !important;
}

/* FINAL CONTEXT HELPER OVERRIDE */

.topbar .context-helper{
  font-size:14px !important;
  line-height:1.35 !important;
  color:#64748b !important;
  margin-top:8px !important;
}

/* Assignment selector emphasis */

#assignmentSelect{
  background:#2563eb !important;
  color:#ffffff !important;
  border:1px solid #2563eb !important;
  font-weight:800 !important;

  box-shadow:
    0 6px 14px rgba(37,99,235,.25);
}

/* White dropdown arrow */

#assignmentSelect{
  background-image:
    linear-gradient(45deg, transparent 50%, #ffffff 50%),
    linear-gradient(135deg, #ffffff 50%, transparent 50%);
}

#assignmentSelect{
  background:linear-gradient(
    135deg,
    #2563eb 0%,
    #1d4ed8 100%
  ) !important;

  color:#ffffff !important;
  border:none !important;

  box-shadow:
    0 8px 18px rgba(37,99,235,.28);
}

.active-context-label{
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#2563eb;
}

/* FINAL ASSIGNMENT SELECT EMPHASIS */

#assignmentSelect{
  background:#2563eb !important;
  color:#ffffff !important;
  border:1px solid #1d4ed8 !important;
  font-weight:850 !important;
  box-shadow:0 8px 18px rgba(37,99,235,.28) !important;
  background-image:none !important;
}

#assignmentSelect option{
  background:#ffffff;
  color:#172033;
}

.active-context-label{
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#2563eb;
}

/* =========================================================
   CALENDAR & PLANNING
========================================================= */

.calendar-page{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.calendar-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:22px;
  padding:18px 22px;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}

.calendar-toolbar h2{
  margin:0;
  font-size:26px;
  color:#10233f;
}

.calendar-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:18px;
  align-items:start;
}

.calendar-main,
.calendar-side-panel{
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:22px;
  padding:18px;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}

.calendar-weekdays{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  border-bottom:1px solid #dbe4f0;
  margin-bottom:8px;
}

.calendar-weekdays div{
  padding:12px;
  font-size:12px;
  font-weight:900;
  color:#64748b;
  text-transform:uppercase;
}

.calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:8px;
}

.calendar-day{
  min-height:130px;
  border:1px solid #e5eaf2;
  border-radius:16px;
  padding:10px;
  background:#f8fbff;
}

.calendar-day.today{
  border:2px solid #2563eb;
  background:#eef5ff;
}

.calendar-day-number{
  font-size:13px;
  font-weight:900;
  color:#334155;
  margin-bottom:8px;
}

.calendar-day-events{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.calendar-event{
  position:relative;

  border-radius:8px;
  padding:6px 8px 6px 12px;

  font-size:11px;
  font-weight:500;   /* was 800 */

  line-height:1.35;
  color:#172033;

  background:#ffffff;
  border:1px solid #e5eaf2;
}

.calendar-event::before{
  content:"";

  position:absolute;
  left:0;
  top:0;
  bottom:0;

  width:4px;
  border-radius:4px 0 0 4px;
}

/* Assessment */

.calendar-event.assessment{
  background:#eef2ff;
}

.calendar-event.assessment::before{
  background:#4338ca;
}

/* Task */

.calendar-event.task{
  background:#dbeafe;
}

.calendar-event.task::before{
  background:#2563eb;
}

/* Meeting */

.calendar-event.meeting{
  background:#dcfce7;
}

.calendar-event.meeting::before{
  background:#16a34a;
}

/* Evidence */

.calendar-event.evidence{
  background:#fef3c7;
}

.calendar-event.evidence::before{
  background:#d97706;
}

/* Milestone */

.calendar-event.milestone{
  background:#fce7f3;
}

.calendar-event.milestone::before{
  background:#db2777;
}



.calendar-side-panel h3{
  margin:0 0 14px;
  color:#173f66;
}

.calendar-upcoming-item{
  padding:12px 14px;
  border-radius:14px;
  margin-bottom:10px;
}

.calendar-upcoming-item strong{
  display:block;
  font-size:14px;
}

.calendar-upcoming-item span{
  display:block;
  margin-top:4px;
  font-size:12px;
  font-weight:800;
  opacity:.8;
}

.calendar-sync-card{
  margin-top:18px;
  padding:16px;
  border-radius:16px;
  border:1px solid #cfe0f7;
  background:#eef5ff;
}

.calendar-sync-card strong{
  display:block;
  color:#1d4ed8;
  margin-bottom:8px;
}

.calendar-sync-card p{
  margin:0;
  color:#475569;
  line-height:1.45;
  font-size:13px;
}

@media(max-width:1100px){
  .calendar-layout{
    grid-template-columns:1fr;
  }

  .calendar-grid,
  .calendar-weekdays{
    grid-template-columns:1fr;
  }
}

.calendar-legend{
  display:flex;
  gap:10px;
  margin:0 0 16px;
  padding:12px 16px;
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:16px;
}

.calendar-legend span{
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
}

.calendar-legend .assessment{ background:#e8edff; color:#3730a3; }
.calendar-legend .task{ background:#dbeafe; color:#1d4ed8; }
.calendar-legend .meeting{ background:#dcfce7; color:#166534; }
.calendar-legend .evidence{ background:#fef3c7; color:#92400e; }
.calendar-legend .milestone{ background:#fce7f3; color:#9d174d; }

.calendar-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.calendar-toolbar-centre{
  display:flex;
  align-items:center;
  gap:12px;
}

.calendar-toolbar-centre h2{
  margin:0;
  min-width:180px;
  text-align:center;
}

.calendar-upcoming-item{
  color:#172033;
  border-left:4px solid transparent;
}

.calendar-upcoming-item.assessment{
  background:#eef2ff;
  border-left-color:#4338ca;
}

.calendar-upcoming-item.task{
  background:#dbeafe;
  border-left-color:#2563eb;
}

.calendar-upcoming-item.meeting{
  background:#dcfce7;
  border-left-color:#16a34a;
}

.calendar-upcoming-item.evidence{
  background:#fef3c7;
  border-left-color:#d97706;
}

.calendar-upcoming-item.milestone{
  background:#fce7f3;
  border-left-color:#db2777;
}

.calendar-upcoming-item strong{
  display:block;

  font-size:14px;
  font-weight:600;   /* was effectively very bold */

  color:#172033;
}

.calendar-upcoming-item span{
  display:block;

  margin-top:4px;

  font-size:12px;
  font-weight:400;

  color:#64748b;
}

#page-title,
.topbar h2{
  font-weight:600 !important;
}

/* =========================================================
   ANNOUNCEMENTS
========================================================= */

.announcement-filter-bar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:18px;
}

.announcement-filter-bar button{
  border:1px solid #dbe4f0;
  background:#ffffff;
  color:#334155;
  border-radius:999px;
  padding:8px 14px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}

.announcement-filter-bar button.active{
  background:#2563eb;
  color:#ffffff;
  border-color:#2563eb;
}

.announcement-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.announcement-card{
  border:1px solid #dbe4f0;
  border-left:5px solid #2563eb;
  border-radius:18px;
  padding:18px 20px;
  background:#ffffff;
}

.announcement-card.unread{
  background:#f8fbff;
}

.announcement-card.urgent{
  border-left-color:#dc2626;
}

.announcement-card.assessment{
  border-left-color:#f59e0b;
}

.announcement-card.general{
  border-left-color:#2563eb;
}

.announcement-card h3{
  margin:10px 0 4px !important;
  font-size:20px !important;
  font-weight:550 !important;
  color:#10233f !important;
}

.announcement-meta{
  margin:0 !important;
  color:#64748b !important;
  font-size:13px;
}

.announcement-body{
  margin:14px 0 16px !important;
  color:#475569 !important;
  line-height:1.5;
}

.announcement-type,
.announcement-pin{
  display:inline-flex;
  padding:5px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  margin-right:6px;
}

.announcement-type.general{
  background:#dbeafe;
  color:#1d4ed8;
}

.announcement-type.assessment{
  background:#fef3c7;
  color:#92400e;
}

.announcement-type.urgent{
  background:#fee2e2;
  color:#991b1b;
}

.announcement-pin{
  background:#f3e8ff;
  color:#6b21a8;
}

.announcement-card{
  padding:16px 20px;
}

.announcement-body{
  margin:10px 0 12px !important;
}

.announcement-card .btn{
  margin-top:0;
}

.announcement-list{
  gap:10px;
}

.announcement-card.unread{
  border-left-width:6px;
}

.announcement-card.unread::after{
  content:"NEW";
}

/* Announcements: remove icon block backgrounds */

.announcement-stats .dashboard-metric-icon{
  background:transparent !important;
  box-shadow:none !important;
  color:#172033 !important;
}

.dashboard-metric-icon svg{
  width:30px;
  height:30px;
}

/* Announcement stat cards */

.announcement-stats .dashboard-metric-icon{
  background:transparent;
  box-shadow:none;
  border:none;
  padding:0;
  width:auto;
  height:auto;
}

.announcement-stats .dashboard-metric-icon svg{
  width:28px;
  height:28px;
}

.announcement-stats .dashboard-metric-icon.tf-blue{
  color:var(--blue2);
}

.announcement-stats .dashboard-metric-icon.tf-orange{
  color:var(--orange);
}

.announcement-stats .dashboard-metric-icon.tf-purple{
  color:var(--purple);
}

.announcement-stats .dashboard-metric-icon.tf-red{
  color:var(--red);
}

/* Compact announcement stat cards */

.announcement-stats .dashboard-metric-card{
  min-height:150px;
  padding:22px 26px;
}

.announcement-stats .dashboard-metric-top{
  margin-bottom:16px;
}

.announcement-stats .dashboard-metric-icon{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
}

.announcement-stats .dashboard-metric-icon svg{
  width:24px;
  height:24px;
}

.announcement-stats .dashboard-metric-value{
  font-size:34px;
  margin-top:4px;
}

.announcement-stats .dashboard-metric-card p{
  font-size:13px;
}

/* FINAL: Announcements stat icon cleanup */

.announcement-stats .dashboard-metric-icon,
.announcement-stats .metric-blue,
.announcement-stats .metric-green,
.announcement-stats .metric-orange,
.announcement-stats .metric-purple,
.announcement-stats .metric-red{
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  color:#2563eb !important;
}

.announcement-stats .dashboard-metric-icon svg{
  width:28px !important;
  height:28px !important;
  stroke:currentColor !important;
}

.announcement-stats .dashboard-metric-header{
  margin-bottom:12px !important;
}

.announcement-stats .dashboard-metric-icon{
  margin-bottom:0 !important;
}

.announcement-stats .dashboard-metric-top{
  gap:10px !important;
  margin-bottom:8px !important;
}

/* FINAL: Announcements stat card cleanup */

.announcement-stats .dashboard-metric-card{
  min-height:135px !important;
  padding:20px 26px !important;
  justify-content:center !important;
  gap:6px !important;
}

.announcement-stats .dashboard-metric-top{
  gap:10px !important;
  margin-bottom:6px !important;
}

.announcement-stats .dashboard-metric-icon,
.announcement-stats .metric-blue,
.announcement-stats .metric-orange,
.announcement-stats .metric-purple,
.announcement-stats .metric-red{
  background:transparent !important;
  box-shadow:none !important;
  border-radius:0 !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
}

.announcement-stats .dashboard-metric-icon svg{
  width:26px !important;
  height:26px !important;
  stroke:currentColor !important;
}

.announcement-stats .dashboard-metric-value{
  font-size:34px !important;
  margin-top:0 !important;
}

.announcement-stats .dashboard-metric-card p{
  font-size:13px !important;
  margin:0 !important;
}

/* FINAL: Compact task cards on My Dashboard */

.dashboard-focus-panel-v2 .task-card,
.dashboard-focus-panel-v2 .task-card-modern{
  min-height:auto !important;
  padding:14px 18px !important;
  gap:4px !important;
}

.dashboard-focus-panel-v2 .task-card strong,
.dashboard-focus-panel-v2 .task-card-modern strong{
  margin:0 !important;
  line-height:1.2 !important;
}

.dashboard-focus-panel-v2 .task-card p,
.dashboard-focus-panel-v2 .task-card-modern p{
  margin:4px 0 !important;
  line-height:1.25 !important;
}

.dashboard-focus-panel-v2 .task-card small,
.dashboard-focus-panel-v2 .task-card-modern small{
  margin-top:2px !important;
  line-height:1.2 !important;
}

/* =========================================================
   ASSIGNMENT ENGINE
========================================================= */

.assignment-engine-page{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.assignment-engine-hero{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:30px;
}

.assignment-engine-hero h2{
  margin:8px 0 10px;
}

.assignment-engine-hero p{
  color:var(--muted);
  max-width:700px;
}

.assignment-engine-meta{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  min-width:280px;
}

.assignment-engine-meta div{
  background:#f8fafc;
border:2px solid var(--blue2);
  border-radius:14px;
  padding:12px;
}

.assignment-engine-meta span{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:4px;
}

.assignment-engine-meta strong{
  font-size:14px;
}

.live-report-textarea{
  width:100%;
  min-height:700px;
  padding:24px;
  border:2px solid var(--blue2);
    border-radius:16px;
  background:#fff;
  font-size:15px;
  line-height:1.7;
  resize:vertical;
  transition:.2s;
}

.live-report-textarea:focus{
  border-color:var(--blue2);
  box-shadow:0 0 0 4px rgba(47,111,237,.12);
}

/* =========================================================
   LAYOUT
========================================================= */

.assignment-engine-layout{
  display:grid;
  grid-template-columns:2fr 360px;
  gap:20px;
  align-items:start;
}

.assignment-engine-main{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.assignment-engine-side{
  position:sticky;
  top:20px;
}

/* =========================================================
   STAGE BLOCK
========================================================= */

.assignment-stage-block{
  padding:24px;
}

.assignment-stage-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:18px;
}

.assignment-stage-header h3{
  margin-bottom:6px;
}

.assignment-stage-header p{
  color:var(--muted);
  margin:0;
}

.assignment-stage-pill{
  background:#eef4ff;
  color:var(--blue2);
  font-weight:600;
  border-radius:999px;
  padding:8px 14px;
  white-space:nowrap;
}

/* =========================================================
   ACTIVITY LIST
========================================================= */

.assignment-activity-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.assignment-activity-card{
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px;
  background:#fff;
  transition:.2s;
}

.assignment-activity-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--tf-shadow-sm);
}

.assignment-activity-card.required{
  border-left:5px solid var(--blue2);
}

.assignment-activity-card.optional{
  border-left:5px solid var(--green);
}

.assignment-activity-top{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:12px;
}

.assignment-activity-top strong{
  display:block;
  margin-bottom:4px;
}

.assignment-activity-top span{
  color:var(--muted);
  font-size:14px;
}

.assignment-activity-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:14px;
}

.assignment-activity-meta span{
  background:#f4f6fa;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  color:var(--muted);
}

/* =========================================================
   STATUS BADGES
========================================================= */

.assignment-status{
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
}

.assignment-status.complete{
  background:#e7f8ef;
  color:#0f8b57;
}

.assignment-status.in-progress{
  background:#eef4ff;
  color:#2f6fed;
}

.assignment-status.incomplete{
  background:#fff3e5;
  color:#d97706;
}

.assignment-status.missing{
  background:#ffeaea;
  color:#c53030;
}

.assignment-status.not-started{
  background:#f3f4f6;
  color:#6b7280;
}

/* =========================================================
   READINESS PANEL
========================================================= */

.assignment-readiness-panel{
  padding:24px;
}

.assignment-readiness-panel h3{
  margin-bottom:20px;
}

.assignment-readiness-score{
  width:140px;
  height:140px;
  border-radius:50%;
  background:linear-gradient(
    135deg,
    var(--blue2),
    var(--purple)
  );
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  font-weight:700;
  margin:0 auto 20px;
}

.readiness-check-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:20px;
}

.readiness-check{
  border-radius:14px;
  padding:14px;
}

.readiness-check strong{
  display:block;
  margin-bottom:4px;
}

.readiness-check span{
  color:var(--muted);
  font-size:13px;
}

.readiness-check.complete{
  background:#ecfdf5;
  border-left:4px solid #10b981;
}

.readiness-check.warning{
  background:#fffbeb;
  border-left:4px solid #f59e0b;
}

.readiness-check.pending{
  background:#f8fafc;
  border-left:4px solid #94a3b8;
}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1100px){

  .assignment-engine-layout{
    grid-template-columns:1fr;
  }

  .assignment-engine-side{
    position:relative;
    top:auto;
  }

  .assignment-engine-hero{
    flex-direction:column;
  }

  .assignment-engine-meta{
    width:100%;
  }
}

/* FINAL: Keep topbar selectors on one line */

.topbar{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:28px !important;
}

.context-selector{
  width:auto !important;
  max-width:none !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:12px !important;
  align-items:flex-end !important;
}

.context-control{
  min-width:150px !important;
}

.context-control select,
.selectors select{
  min-width:150px !important;
}

/* FINAL: Keep topbar selectors on one line, helper below */

.topbar{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:28px !important;
}

.context-selector{
  width:auto !important;
  max-width:none !important;
  display:grid !important;
grid-template-columns:200px 150px 150px 210px !important;
  gap:10px 12px !important;
  align-items:end !important;
}

.context-control select,
.selectors select{
  min-width:0 !important;
  width:100% !important;
}

.context-helper{
  grid-column:1 / -1 !important;
  margin-top:4px !important;
}

/* ==========================================
   LIVE REPORT V1
========================================== */

.live-report-page{
  display:grid;
  grid-template-columns:280px 1fr 300px;
  gap:18px;
  align-items:start;
}

.live-report-sidebar,
.live-report-editor,
.live-report-insights{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.live-report-progress-card{
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:20px;
  padding:20px;
}

.live-report-sections{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.report-section{
  border:1px solid #dbe4f0;
  background:#fff;
  border-radius:12px;
  padding:12px 14px;
  text-align:left;
  cursor:pointer;
}

.report-section.active{
  background:#eef5ff;
  border-color:#2563eb;
  color:#2563eb;
  font-weight:700;
}

.live-report-editor{
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:20px;
  padding:20px;
}

.live-report-editor-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:18px;
}

.live-report-textarea{
  min-height:700px;
  resize:vertical;
  font-size:15px;
  line-height:1.7;
}

.live-report-insights .card{
  margin:0;
}

.live-report-editor-header{
  margin-bottom:16px;
}

.report-section-card{
  margin-top:0;
  margin-bottom:16px;
}

.report-editor-toolbar{
  margin-bottom:12px;
}


/* FINAL: Live Report spacing cleanup */

.live-report-editor-header{
  margin-bottom:10px !important;
}

.report-section-card{
  margin-top:0 !important;
  margin-bottom:12px !important;
}

.report-section-card h2{
  margin-top:0 !important;
}

.section-purpose{
  margin-top:0 !important;
}

.section-purpose strong,
.section-includes strong{
  display:block;
  margin-bottom:6px !important;
}

.section-includes ul{
  margin-top:6px !important;
  margin-bottom:14px !important;
}

.report-editor-toolbar{
  margin-top:8px !important;
  margin-bottom:10px !important;
}

.section-purpose{
  margin:0 0 8px 0 !important;
}

.section-purpose p{
  margin:0 !important;
}

.section-includes{
  margin:22px 0 8px 0 !important;
}

/* ==========================================
   LIVE REPORT SPACING FIX
========================================== */

.live-report-editor-header{
  margin-bottom:6px !important;
  padding-bottom:0 !important;
}

.report-section-card{
  margin-top:0 !important;
  margin-bottom:8px !important;
  padding-top:0 !important;
}

.report-section-card h2,
.report-section-card h3{
  margin-top:0 !important;
  margin-bottom:6px !important;
}

.section-purpose{
  margin-top:0 !important;
  margin-bottom:8px !important;
}

.section-purpose strong{
  margin:0 0 4px 0 !important;
}

.section-purpose p{
  margin:0 !important;
}

.section-includes strong{
  margin-bottom:4px !important;
}

.section-includes ul{
  margin:4px 0 8px 20px !important;
}

.report-editor-toolbar{
  margin:4px 0 6px 0 !important;
  padding:0 !important;
}

.live-report-textarea{
  margin-top:0 !important;
}

/* FINAL: Live Report tight layout */

.live-report-editor{
  gap:0 !important;
}

.live-report-editor-header{
  margin-bottom:10px !important;
}

.report-section-card{
  margin:0 0 8px 0 !important;
  padding:0 !important;
}

.report-section-card h2{
  margin:0 0 8px 0 !important;
}

.section-meta{
  margin-bottom:10px !important;
}

.section-purpose{
  margin:0 0 8px 0 !important;
}

.section-purpose strong,
.section-includes strong{
  display:block !important;
  margin:0 0 4px 0 !important;
}

.section-purpose p{
  margin:0 !important;
}

.section-includes{
  margin:22px 0 8px 0 !important;
}
.section-includes ul{
  margin:4px 0 0 18px !important;
  padding:0 !important;
}

.report-editor-toolbar{
  margin:6px 0 6px 0 !important;
  padding:6px 8px !important;
}

.live-report-textarea{
  margin:0 !important;
}

.report-section{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:12px !important;
}

.report-section strong{
  display:block;
  font-size:13px;
  color:#10233f;
}

.report-section small{
  display:block;
  margin-top:4px;
  font-size:11px;
  color:#64748b;
}

.report-section > span{
  font-size:12px;
  font-weight:800;
  color:#2563eb;
  background:#eef5ff;
  border-radius:999px;
  padding:5px 8px;
  flex-shrink:0;
}

.live-report-section-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:0 0 14px 0;
}

.live-report-section-metrics div{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:14px;
  padding:12px 14px;
}

.live-report-section-metrics span{
  display:block;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:4px;
}

.live-report-section-metrics strong{
  font-size:18px;
  color:#10233f;
}

/* ==========================================
   LIVE REPORT SECTION PROGRESS
========================================== */

.report-section-progress-card{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:16px;
  padding:14px 16px;
  margin-bottom:14px;
}

.report-section-progress-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}

.report-section-progress-top strong{
  color:#10233f;
}

.report-section-progress-top span{
  font-weight:900;
  color:#2563eb;
}

.report-section-progress-bar{
  height:10px;
  background:#e5eaf2;
  border-radius:999px;
  overflow:hidden;
}

.report-section-progress-fill{
  height:100%;
  background:#2563eb;
  border-radius:999px;
}

.report-section-progress-card small{
  display:block;
  margin-top:8px;
  color:#64748b;
  font-size:12px;
}

.live-report-section-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:12px;
}

.live-report-section-metrics div{
  background:#f8fbff;
  border:1px solid #dbe4f0;
  border-radius:14px;
  padding:12px 14px;
}

.live-report-section-metrics span{
  display:block;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:4px;
}

.live-report-section-metrics strong{
  font-size:16px;
  color:#10233f;
}

.report-header-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.report-status-select{
  border:1px solid #dbe4f0;
  background:#ffffff;
  border-radius:12px;
  padding:10px 14px;
  font-weight:800;
  color:#334155;
}

.report-meta-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:8px;
}

.report-badge{
  padding:6px 12px;
  border-radius:999px;
  background:#eef4ff;
  color:#28456a;
  font-size:12px;
  font-weight:700;
}

.report-badge.status{
  background:#e8f4ec;
  color:#1c7d4d;
}

.report-guidance-panel{
  border:1px solid #dbe4f0;
  border-radius:14px;
  padding:12px;
  margin-bottom:12px;
  background:#fafcff;
}

.report-guidance-panel summary{
  cursor:pointer;
  font-weight:800;
  color:#223b61;
}

.live-report-sections-header{
  margin-bottom:12px;
}

.live-report-sections-header h4{
  margin:0 0 4px;
  font-size:14px;
  font-weight:800;
  color:#223b61;
}

.live-report-sections-header p{
  margin:0;
  font-size:12px;
  color:#64748b;
}


/* ==========================================
   LIVE REPORT EDITOR TOOLBAR UPGRADE
========================================== */

.report-editor-toolbar{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;

  margin:8px 0 8px 0 !important;
  padding:10px 12px !important;

  background:#f8fbff !important;
  border:1px solid #dbe4f0 !important;
  border-radius:14px !important;
}

.report-editor-toolbar button{
  height:36px !important;
  min-width:36px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  border:1px solid #dbe4f0 !important;
  background:#ffffff !important;
  color:#334155 !important;

  border-radius:10px !important;
  cursor:pointer !important;
  font-weight:800 !important;
}

.report-editor-toolbar button:hover{
  background:#eef5ff !important;
  border-color:#bcd2f5 !important;
  color:#2563eb !important;
}

.report-editor-toolbar button svg{
  width:17px !important;
  height:17px !important;
  stroke-width:2.4 !important;
}

.report-editor-toolbar > span{
  width:1px !important;
  height:26px !important;
  background:#dbe4f0 !important;
  margin:0 2px !important;
}

.report-style-select{
  height:36px !important;
  min-width:145px !important;

  border:1px solid #dbe4f0 !important;
  border-radius:10px !important;

  background:#ffffff !important;
  color:#334155 !important;

  padding:0 12px !important;
  font-weight:800 !important;
  cursor:pointer !important;
}

.toolbar-ai-btn{
  padding:0 12px !important;
  background:#eef5ff !important;
  color:#2563eb !important;
  border-color:#bcd2f5 !important;
}

.word-status{
  display:block;
  margin-top:6px;
  font-weight:800;
  color:#dc2626;
}

.report-meta-info{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.report-meta-line{
  font-size:13px;
  color:var(--muted);
}

.report-meta-line strong{
  color:var(--text);
  font-weight:600;
}

/* FINAL FIX: Live Report editor vertical stacking */

.live-report-editor{
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
}

.live-report-editor-header{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
  width:100% !important;
}

.report-section-card{
  width:100% !important;
  display:block !important;
}

.live-report-section-metrics{
  width:100% !important;
}

.report-section-progress-card{
  width:100% !important;
}

.live-report-textarea{
  width:100% !important;
  display:block !important;
}

.report-meta-info{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.report-meta-line{
  font-size:14px;
  color:var(--muted);
}

.live-report-preview-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(15,23,42,.45);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
}

.live-report-preview-window{
  width:min(1000px, 96vw);
  max-height:90vh;
  overflow:auto;
  background:#ffffff;
  border-radius:24px;
  padding:28px;
  box-shadow:0 24px 60px rgba(15,23,42,.25);
}

.live-report-preview-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:24px;
  border-bottom:1px solid #dbe4f0;
  padding-bottom:18px;
}

.live-report-preview-header h2{
  margin:0 0 6px;
}

.live-report-preview-header p{
  margin:0;
  color:#64748b;
}

.live-report-preview-document{
  background:#ffffff;
  padding:28px;
  border:1px solid #e5eaf2;
  border-radius:18px;
}

.preview-report-section{
  padding-bottom:28px;
  margin-bottom:28px;
  border-bottom:1px solid #e5eaf2;
}

.preview-report-section:last-child{
  border-bottom:none;
  margin-bottom:0;
}

.preview-report-section h2{
  margin:0 0 8px;
  color:#10233f;
}

.preview-section-meta{
  margin:0 0 14px;
  color:#64748b;
  font-size:13px;
}

.preview-placeholder{
  padding:16px;
  border-radius:14px;
  background:#f8fbff;
  border:1px dashed #cbd7e8;
  color:#64748b;
}

/* ==========================================
   LIVE REPORT PREVIEW CONSISTENCY FIX
========================================== */

.live-report-preview-document{
  padding:28px;
}

.preview-report-section{
  padding:28px 0;
  border-bottom:1px solid #dbe4f0;
}

.preview-report-section:first-child{
  padding-top:0;
}

.preview-report-section h2{
  margin:0 0 8px;
  font-size:22px;
  color:#10233f;
}

.preview-section-meta{
  margin:0 0 20px;
  font-size:13px;
  color:#52637c;
}

.preview-cover-page h1,
.preview-cover-page h2,
.preview-declaration h2,
.preview-declaration h3{
  margin-top:0;
}

.preview-cover-page p,
.preview-declaration p,
.preview-declaration li,
.auto-toc-box p{
  font-size:14px;
  line-height:1.45;
}

.preview-cover-page hr,
.preview-declaration hr{
  margin:18px 0;
  border:0;
  border-top:1px solid #dbe4f0;
}

.preview-placeholder{
  padding:18px;
  border:1px dashed #cbd5e1;
  border-radius:14px;
  background:#f8fbff;
  color:#64748b;
}

/* ==========================================
   LIVE REPORT GUIDANCE SPACING FIX
========================================== */

.report-guidance-panel summary{
  margin-bottom:10px !important;
}

.report-guidance-panel .section-purpose{
  margin-top:10px !important;
}

.report-guidance-panel ul{
  margin-top:10px !important;
}

/* =========================================================
   MOBILE TEST PAGE
========================================================= */

.mobile-test-body {
  margin: 0;
  background: #ffffff;
  color: #172033;
  font-family: Inter, Arial, sans-serif;
}

.mobile-shell {
  max-width: 520px;
  margin: 0 auto;
  padding: 30px 18px 96px;
  background: #ffffff;
}

.mobile-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.mobile-logo {
  font-size: 28px;
  font-weight: 800;
  color: #172033;
}

.mobile-menu {
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 999px;
  background: #172033;
  color: white;
  font-size: 20px;
}

.mobile-hero-card,
.mobile-card {
  border-radius: 30px;
  padding: 30px;
  margin-bottom: 18px;
  background: white;
  box-shadow: 0 10px 15px rgba(15,23,42,.14);
}

.mobile-hero-card {
  background: #e9f5ec;
}

.mobile-hero-card h1 {
  margin: 8px 0 14px;
  font-size: 42px;
  line-height: 1.02;
  letter-spacing: -1.5px;
}

.mobile-card h2 {
  margin: 8px 0 12px;
  font-size: 30px;
  line-height: 1.1;
}

.mobile-card p,
.mobile-hero-card p {
  font-size: 17px;
  line-height: 1.45;
  color: #465063;
}

.mobile-label {
  margin: 0;
  font-size: 12px !important;
  font-weight: 800;
  letter-spacing: .12em;
  color: #2f6fed !important;
}

.mobile-card.progress {
  background: #fff3a6;
}

.mobile-card.dark {
  background: #0b436f;
  color: white;
    min-height:180px;
}

.mobile-card.dark p,
.mobile-card.dark .mobile-label {
  color: rgba(255,255,255,.86) !important;
}

.mobile-bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 520px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: white;
  border-top: 1px solid #e5eaf2;
  box-shadow: 0 -8px 24px rgba(15,23,42,.08);
}

.mobile-bottom-nav button {
  padding: 15px 4px 18px;
  border: none;
  background: white;
  font-size: 13px;
  font-weight: 700;
  color: #172033;
}


.mobile-logo-img{
  width:180px;
  height:auto;
  display:block;
}

.mobile-brand{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.mobile-sub{
  margin-top:0;
}

.mobile-logo-img{
  width:180px;
  height:auto;
  display:block;
}

.mobile-brand{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.mobile-sub{
  margin-top:0;
  color:#667085;
  font-size:14px;
}

.feature-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}

.feature-toggle-btn{
  min-width:90px;
}

.feature-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}

.feature-toggle-btn{
  min-width:100px;
}

.feature-manager-page{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.feature-manager-hero{
  background:linear-gradient(135deg,#eef6ff,#ffffff);
}

.feature-manager-hero h2{
  margin:8px 0;
  font-size:32px;
}

.feature-group-card h3{
  margin-top:0;
}

.feature-table{
  display:flex;
  flex-direction:column;
  gap:0;
}

.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns: 1.6fr repeat(5, 1fr) 100px;
  align-items:center;
  gap:12px;
  padding:13px 0;
  border-bottom:1px solid var(--line);
}

.feature-table-header{
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
}

.feature-table-row strong{
  color:var(--text);
}

.feature-role-pill{
  display:inline-flex;
  justify-content:center;
  padding:6px 8px;
  border-radius:999px;
  background:#f1f5f9;
  color:#475569;
  font-size:12px;
  font-weight:700;
}

@media(max-width:1100px){
  .feature-table-header,
  .feature-table-row{
    grid-template-columns:1fr 90px;
  }

  .feature-table-header span:nth-child(n+2):nth-child(-n+6),
  .feature-table-row .feature-role-pill{
    display:none;
  }
}

.feature-role-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-width:70px;
  height:28px;

  border:1px solid #d8dee8;
  background:#fff;
  border-radius:999px;

  font-size:12px;
  font-weight:600;
  color:#667085;
}

.permission-dot{
  width:14px;
  height:14px;
  border-radius:50%;
  margin:auto;
}

.permission-dot.none{
  background:#d0d5dd;
}

.permission-dot.view{
  background:#22c55e;
}

.permission-dot.manage{
  background:#3b82f6;
}

.permission-dot.full{
  background:#8b5cf6;
}

.feature-matrix th,
.feature-matrix td{
  text-align:center;
}

.feature-matrix td:first-child,
.feature-matrix th:first-child{
  text-align:left;
}

.permission-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  margin:auto;
  display:block;
}

.permission-dot.view{
  background:#22c55e;
}

.permission-dot.manage{
  background:#3b82f6;
}

.permission-dot.full{
  background:#8b5cf6;
}

.permission-legend{
  display:flex;
  gap:24px;
  align-items:center;
  margin:18px 0;
  padding:12px 18px;
  background:#fff;
  border:1px solid #e5eaf2;
  border-radius:12px;
}

.permission-legend span{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.9rem;
  font-weight:600;
  color:#475467;
}

.permission-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  display:block;
  margin:auto;
}

.permission-dot.student{
  background:#ffffff;
  border:2px solid #98a2b3;
}

.permission-dot.facilitator{
  background:#98a2b3;
}

.permission-dot.admin{
  background:#16a34a;
}

.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns:
    2fr      /* Feature */
    80px     /* Student */
    80px     /* Team Leader */
    80px     /* Facilitator */
    80px     /* Coordinator */
    80px     /* Admin */
    120px;   /* Status */
  align-items:center;
}

.permission-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  justify-self:center;
}

.permission-dot.student{
  background:#fff;
  border:2px solid #98a2b3;
}

.permission-dot.facilitator{
  background:#98a2b3;
}

.permission-dot.admin{
  background:#16a34a;
}

.permission-cell{
  display:flex;
  justify-content:center;
}

.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns:
    1fr
    50px
    50px
    50px
    50px
    50px
    90px;
  align-items:center;
}

.feature-table{
  width:100%;
}

.feature-table-header,
.feature-table-row{
  width:100%;
}
.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns:
    1fr
    220px
    100px;
  align-items:center;
  gap:16px;
}

.access-header,
.access-matrix{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  justify-items:center;
  align-items:center;
}

.access-header{
  font-size:.75rem;
  font-weight:700;
  color:#667085;
}

.permission-dot{
  width:12px;
  height:12px;
  border-radius:50%;
}

.permission-dot.student{
  background:#fff;
  border:2px solid #98a2b3;
}

.permission-dot.facilitator{
  background:#98a2b3;
}

.permission-dot.admin{
  background:#16a34a;
}

.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns: 1fr 180px 110px;
  align-items:center;
  column-gap:18px;
}

.feature-table-header{
  font-size:.8rem;
  font-weight:600;
  color:#667085;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.feature-table-header span:first-child{
  color:#2f6fed;
}

.feature-table-header span:last-child{
  text-align:center;
}

.feature-name{
  font-size:.95rem;
  font-weight:400;
  color:#475467;
}

.access-header,
.access-matrix{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  align-items:center;
  justify-items:center;
}

.feature-switch{
  justify-self:center;
  width:88px;
  height:30px;
  border:1px solid #c7ced8;
  border-radius:999px;
  background:#eef2f7;
  color:#475467;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:.78rem;
  font-weight:700;
}

.feature-switch.on{
  background:#22a652;
  color:#ffffff;
  border-color:#22a652;
}

.feature-switch.disabled{
  background:#f1f3f6;
  color:#98a2b3;
  border-color:#d0d5dd;
  cursor:not-allowed;
}

.feature-section-warning{
  margin:8px 0 14px;
  color:#d92d20;
  font-size:.85rem;
  font-weight:500;
}

.feature-table-header,
.feature-table-row{
  display:grid;
  grid-template-columns:
    minmax(260px,1fr)
    280px
    140px;

  column-gap:40px;
  align-items:center;
}

.sidebar-footer{
  margin-top:auto;
  padding:16px;
  border-top:1px solid var(--line);
}

.sidebar-link-btn{
  width:100%;
  margin-bottom:8px;
}

.activity-feed-item{
  display:flex;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid #eef2f6;
}

.activity-feed-item:last-child{
  border-bottom:none;
}

.activity-avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  background:#2f6fed;
  color:#fff;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:.8rem;
  font-weight:600;
}

.activity-content{
  flex:1;
}

.activity-content small{
  display:block;
  margin-top:4px;
  color:#667085;
}

.feature-card-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

.feature-card-title{
  display:flex;
  gap:16px;
  align-items:flex-start;
}

.feature-card-header .btn{
  flex-shrink:0;
}

.feature-card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}

.feature-card-left{
  display:flex;
  align-items:flex-start;
  gap:14px;
}

.feature-card-button{
  margin-left:auto;
  flex-shrink:0;
  white-space:nowrap;
}

.required{
  color:#d94a4a;
  font-weight:700;
  font-size:1.05em;
}

.form-required-note{
  margin-bottom:18px;
  font-size:0.9rem;
  color:var(--muted);
}

.required{
  color:#d94a4a;
  font-weight:700;
}

.feature-manager-page{
  display:flex;
  flex-direction:column;
  gap:22px;
}

.feature-group-card{
  margin-top:0;
}

.feature-table{
  margin-top:14px;
}

.feature-table-row{
  padding:14px 0;
}

.feature-group-card{
  margin-bottom:28px;
}

.feature-group-card{
  margin-bottom:24px !important;
}

.context-control{
  position: relative;
}

.context-control.locked-context::after{

  content: "🔐"; /* or try a different symbol below */

  position: absolute;

  top: 32px;

  right: 14px;

  font-size: 13px;

  line-height: 1;

}

.context-control select:disabled{
  background:#f8fafc;
  border:1px solid #d0d5dd;
  color:#475467;
  opacity:1;
}

.context-control{
  position: relative;
}

.context-lock{
  position: absolute;
  top: 34px;
  right: 14px;
  width: 14px;
  height: 14px;
  color: #667085;
  pointer-events: none;
}


.tool-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:18px;
}

.tool-card{
  display:block;
  padding:20px;
  border-radius:18px;
  background:#ffffff;
  border:1px solid #e5e7eb;
  text-decoration:none;
  color:#0f172a;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
  transition:.18s ease;
}

.tool-card:hover{
  transform:translateY(-2px);
  border-color:#2563eb;
  box-shadow:0 12px 26px rgba(37,99,235,.14);
}

.tool-card h3{
  margin:0 0 8px;
  font-size:16px;
}

.tool-card p{
  margin:0;
  color:#64748b;
  font-size:14px;
  line-height:1.45;
}

.tool-category{
  margin-bottom:32px;
}

.tool-category h2{
  margin-bottom:6px;
}

.tool-category > p{
  margin-bottom:16px;
  color:#64748b;
}

.tool-grid{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}

.tool-card{
  width:280px;
  min-height:140px;

  display:block;
  padding:20px;
  border-radius:18px;
  background:#fff;
  border:1px solid #e5e7eb;
  text-decoration:none;
  color:#0f172a;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
  transition:.18s ease;
}

.tool-card:hover{
  transform:translateY(-3px);
  border-color:#2563eb;
  box-shadow:0 14px 30px rgba(37,99,235,.15);
}

.tool-link{
  display:block;
  margin-top:14px;
  font-size:13px;
  font-weight:600;
  color:#2563eb;
}

.student-table{
  margin-top:14px;
  border:1px solid #e2e8f0;
  border-radius:14px;
  overflow:hidden;
}

.student-actions{
  display:flex;
  gap:8px;
  margin:0 0 28px 0;
}

.student-table{
  margin-top:14px;
  border:1px solid #e2e8f0;
  border-radius:14px;
  overflow:hidden;
}

.student-table-header,

.student-table-row{

  display:grid;

  grid-template-columns:

    150px       /* Student ID */
    220px      /* Name */
    minmax(250px, 1fr) /* Email */
    100px      /* Stream */
    140px      /* Team */
    170px;     /* Actions */
  gap:16px;
  padding:12px 16px;
  align-items:center;
}

.student-table-row span:nth-child(2),
.student-table-header div:nth-child(2){
  padding-left:12px;
}

.student-table-header{
  background:#f8fafc;
  font-weight:700;
  color:#334155;
  border-bottom:1px solid #e2e8f0;
}

.student-table-row{
  border-bottom:1px solid #eef2f7;
}

.student-table-row:last-child{
  border-bottom:0;
}

.student-row-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.student-table-header div:last-child{
  text-align:right;
}

.team-management-table .student-table-header div:last-child{
  text-align:right;
}

.btn-sm{
  padding:6px 10px;
  font-size:12px;
}

.btn.danger{
  background:#fff5f5;
  color:#9b1c1c;
  border:1px solid #ead1d1;
}

.team-management-table{
  margin-top:14px;
  border:1px solid #e2e8f0;
  border-radius:14px;
  overflow:hidden;
}

.team-management-table .student-table-header,
.team-management-table .student-table-row{
  display:grid;
  grid-template-columns:
    180px      /* Team */
    150px      /* Stream */
    minmax(220px, 1fr) /* Leader */
    100px      /* Students */
    120px      /* Status */
    170px;     /* Actions */

  gap:16px;
  padding:12px 16px;
  align-items:center;
}

.team-management-table .student-table-header{
  background:#f8fafc;
  font-weight:700;
  color:#334155;
  border-bottom:1px solid #e2e8f0;
}

.team-management-table .student-table-row{
  border-bottom:1px solid #eef2f7;
}

.team-management-table .student-table-row:last-child{
  border-bottom:0;
}

.team-assignment-list{
  display:grid;
  gap:8px;
  margin-top:10px;
}

.team-assignment-row{
  display:grid;
  grid-template-columns:24px 1fr 1fr;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#f8fafc;
}

.team-assignment-row small{
  color:#64748b;
}

.tool-frame-clean{
  width:100%;
  min-height:1400px;
  height:1400px;
  border:0;
  border-radius:18px;
  background:transparent;
}

.app-footer{
  text-align:center;
  padding:20px 0;
  color:#64748b;
}

.footer-version{
  font-size:13px;
  font-weight:700;
  margin-bottom:4px;
}

.footer-framework{
  font-size:12px;
  margin-bottom:4px;
}

.footer-credit{
  font-size:12px;
}
/* Team Dashboard: constrain the profile image and style its status components. */
.team-dashboard-hero > * { min-width: 0; }
.team-dashboard-hero .logged-user-inline { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.team-dashboard-hero .logged-user-avatar { width:56px; height:56px; flex:0 0 56px; overflow:hidden; border-radius:50%; }
.team-dashboard-hero .logged-user-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.team-dashboard-hero .logged-user-inline-text { min-width:0; }
.team-dashboard-hero .logged-user-inline-text strong,
.team-dashboard-hero .logged-user-inline-text span { display:block; overflow-wrap:anywhere; }
.team-dashboard-hero .logged-user-inline-text span { color:#667085; font-size:13px; margin-top:4px; }
.team-dashboard-hero .dashboard-progress-circle { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; border-radius:50%; background:conic-gradient(#2563eb calc(var(--progress, 0) * 1%), #e5eaf2 0); }
.team-dashboard-hero .dashboard-progress-circle::before { content:""; position:absolute; inset:10px; background:#fff; border-radius:50%; }
.team-dashboard-hero .dashboard-progress-circle > * { position:relative; }
.team-dashboard-hero .dashboard-progress-number { font-size:28px; font-weight:800; color:#172033; }
.team-dashboard-hero .dashboard-progress-circle > span { font-size:13px; color:#667085; }
.team-dashboard-hero .workflow-rail { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0; }
.team-dashboard-hero .workflow-rail-item { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid #e5eaf2; border-radius:12px; color:#667085; font-size:13px; }
.team-dashboard-hero .workflow-rail-dot { width:8px; height:8px; border-radius:50%; background:#cbd5e1; }
.team-dashboard-hero .workflow-rail-item.unlocked .workflow-rail-dot { background:#2563eb; }
.team-dashboard-hero .workflow-rail-item.current { border-color:#2563eb; background:#eef5ff; color:#1d4ed8; font-weight:700; }
.team-dashboard-hero .workflow-rail-item.current .workflow-rail-dot { background:#2563eb; }
.team-dashboard-hero .dashboard-hero-metrics { grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.team-dashboard-hero .hero-metric-card { display:flex; flex-direction:column; justify-content:center; gap:8px; }
.team-dashboard-hero .hero-metric-card strong { font-size:24px; overflow-wrap:anywhere; }
.team-dashboard-hero .hero-metric-card span { color:#667085; font-size:13px; }
.team-dashboard-hero .dashboard-actions-header { font-weight:700; margin-bottom:12px; }
.team-dashboard-hero .dashboard-report-btn { margin-top:16px; width:100%; }
@media (max-width:600px) {
  .team-dashboard-hero .team-hero-header-row { grid-template-columns:1fr; }
  .team-dashboard-hero .dashboard-hero-main,
  .team-dashboard-hero .dashboard-actions-panel { padding:20px; }
}

/* Full-width platform identity, shared by the landing page and workspace. */
 .openteams-header { width:100%; background:linear-gradient(120deg,#0c2238,#173c58); color:#fff; border-radius:18px 18px 0 0; box-shadow:0 8px 30px rgba(4,18,31,.18); }
.openteams-header-inner { height:156px; max-width:1480px; margin:0 auto; padding:0 32px; display:flex; align-items:center; }
.openteams-header-brand { display:inline-flex; align-items:center; gap:24px; padding:0; border:0; background:none; color:#fff; cursor:pointer; text-align:left; font-family:Inter,system-ui,sans-serif; }
.openteams-mark { width:76px; height:76px; flex:0 0 76px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.42); border-radius:16px; background:rgba(255,255,255,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 10px 28px rgba(0,0,0,.12); font:850 19px/1 Inter,system-ui,sans-serif; letter-spacing:.035em; }
.openteams-wordmark { display:grid; grid-template-columns:auto auto; align-items:baseline; width:max-content; }
.openteams-wordmark strong { color:#60a5fa; font:820 clamp(40px,4vw,56px)/.96 Inter,system-ui,sans-serif; letter-spacing:-1.8px; }
.openteams-wordmark b { margin-left:3px; color:#60a5fa; font:750 clamp(20px,2vw,27px)/1 Inter,system-ui,sans-serif; letter-spacing:-.5px; }
.openteams-wordmark small { grid-column:1 / -1; margin-top:10px; color:#c6d9e6; font:600 13px/1.25 Inter,system-ui,sans-serif; }
.openteams-header-brand:focus-visible { outline:3px solid #93c5fd; outline-offset:8px; border-radius:4px; }
@media (max-width:850px) {
  .openteams-wordmark strong { font-size:38px; }
  .openteams-wordmark b { font-size:20px; }
  .openteams-wordmark small { font-size:11px; margin-top:7px; }
}
@media (max-width:760px) {
  .openteams-header-inner { height:124px; padding:0 20px; }
  .openteams-header-brand { gap:15px; }
  .openteams-mark { width:58px; height:58px; flex-basis:58px; border-radius:13px; font-size:17px; }
}
@media (max-width:580px) {
  .openteams-header-inner { padding:0 16px; }
  .openteams-header-brand { gap:12px; }
  .openteams-mark { width:52px; height:52px; flex-basis:52px; font-size:15px; }
  .openteams-wordmark strong { font-size:29px; letter-spacing:-1px; }
  .openteams-wordmark b { font-size:16px; }
  .openteams-wordmark small { font-size:9.5px; max-width:240px; }
}
#appShell { min-height:calc(100vh - 156px); }
#appShell > .sidebar { padding-top:24px; flex-shrink:0; }
#appShell > .main { min-width:0; min-height:calc(100vh - 156px); }
#appShell .topbar { height:auto; min-height:144px; flex-wrap:wrap; align-items:center !important; gap:20px !important; }
#appShell .topbar > div:first-child { flex:1 1 260px; }
#appShell .topbar .context-selector { flex:1 1 700px; grid-template-columns:minmax(180px,1.2fr) repeat(2,minmax(130px,1fr)) minmax(180px,1.2fr) !important; }
#appShell .topbar .context-control { min-width:0 !important; }
@media (max-width:800px) {
  #appShell { flex-direction:column; }
  #appShell > .sidebar { width:100%; min-width:0; max-height:280px; overflow:auto; border-right:0; border-bottom:1px solid #e5eaf2; }
  #appShell > .main { width:100%; }
  #appShell .topbar { padding:22px 20px; }
  #appShell .topbar .context-selector { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* Platform footer: shared OpenStudios structure with the OpenTeams blue identity. */
.openteams-footer { width:100%; background:#102b40; color:#d7e2ec; border-top:4px solid #2563eb; }
.openteams-footer-grid { max-width:1480px; margin:0 auto; padding:48px 32px 40px; display:grid; grid-template-columns:minmax(240px,1.35fr) repeat(3,minmax(0,1fr)); gap:40px; }
.openteams-footer-grid > section { min-width:0; }
.openteams-footer h2 { margin:0 0 16px; color:#fff; font-size:30px; line-height:1.15; letter-spacing:-1px; }
.openteams-footer h2 span { color:#60a5fa; }
.openteams-footer h2 small { font-size:20px; }
.openteams-footer h3 { margin:0 0 18px; color:#fff; font-size:15px; }
.openteams-footer p { margin:0 0 16px; font-size:14px; line-height:1.65; }
.openteams-footer-version { display:inline-block; margin-top:4px; padding:8px 10px; border:1px solid #426078; border-radius:8px; color:#bfdbfe; font-size:12px; }
.openteams-footer-links { display:flex; flex-direction:column; gap:12px; margin:0; padding:0; list-style:none; }
.openteams-footer-links a,
.openteams-footer-links button { display:inline-block; max-width:100%; border:0; padding:0; background:none; color:#d7e2ec; text-decoration:none; font:inherit; font-size:13px; line-height:1.5; text-align:left; cursor:pointer; }
.openteams-footer-links a:hover,
.openteams-footer-links button:hover { color:#93c5fd; text-decoration:underline; }
.openteams-footer-links a:focus-visible,
.openteams-footer-links button:focus-visible { outline:2px solid #93c5fd; outline-offset:5px; border-radius:2px; }
.openteams-footer-bottom { max-width:1480px; margin:0 auto; padding:22px 32px; border-top:1px solid #365166; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px 32px; }
.openteams-footer-bottom p { margin:0; font-size:12px; }
@media (max-width:1000px) { .openteams-footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; } }
@media (max-width:600px) { .openteams-footer-grid { grid-template-columns:1fr; padding:32px 20px; } .openteams-footer-bottom { padding:20px; } }

/* OpenStudios library and live GPS guidance */
.guidance-note {padding:20px; margin-bottom:20px; border:1px solid #bfdbfe; border-radius:16px; background:#eff6ff; color:#1e3a5f; line-height:1.65;}
.studio-grid, .gps-stage-grid {display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:18px; margin-bottom:20px;}
.studio-card {padding:24px; min-width:0; margin-bottom:20px;}
.studio-card p {line-height:1.6; margin:12px 0;}
.studio-card h3 {margin-top:0;}
.studio-tool-list {display:grid; gap:10px; margin-top:20px;}
.studio-tool-link {display:flex; justify-content:space-between; gap:12px; padding:12px 14px; border:1px solid #bfdbfe; border-radius:10px; color:#1d4ed8; background:#f8fbff; text-decoration:none;}
.studio-tool-link:hover {background:#dbeafe;}
.studio-tool-link:focus-visible {outline:3px solid #2563eb; outline-offset:3px;}
.gps-metrics {display:flex; flex-wrap:wrap; gap:24px; margin:24px 0;}
.gps-metrics strong, .gps-metrics span {display:block;}
.gps-metrics strong {font-size:26px; color:#1d4ed8;}
.gps-stage-status {font-weight:700; color:#1d4ed8;}

/* The welcome panel stands alone outside the workspace. */
body.welcome-screen > .openteams-header,
body.welcome-screen > .openteams-footer { display:none; }

/* Shared Open Platform report editors */
.report-actions {display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.report-actions input[type=file] {max-width:210px;margin-left:8px;}
.report-fields {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;}
.report-fields label,.report-text-label {display:grid;gap:7px;text-transform:none;}
.report-fields input,.report-section textarea,.report-section select {width:100%;min-width:0;padding:12px;border:1px solid #b6c8df;border-radius:8px;background:white;color:#17243a;font:inherit;}
.report-section {padding:22px;margin-bottom:16px;}
.report-section summary {font-weight:700;font-size:18px;cursor:pointer;}
.report-section p,.report-section li {line-height:1.6;}
.report-text-label {margin:20px 0;}

/* Shared Open Platform page frame: OpenStudios' 1480px shell and 32px gutters. */
:root { --platform-width:1480px; --platform-gutter:32px; }
.openteams-header-inner,.openteams-footer-grid,.openteams-footer-bottom { max-width:var(--platform-width); padding-left:var(--platform-gutter); padding-right:var(--platform-gutter); }
#appShell { width:100%; max-width:var(--platform-width); margin:0 auto; padding:0 var(--platform-gutter); box-sizing:border-box; }
#appShell > .main { flex:1 1 0; width:0; min-width:0; container-type:inline-size; }
#appShell > .sidebar { width:250px; min-width:250px; }
#appShell #content { width:100%; max-width:none; padding:28px 32px; }
#appShell #content > * { min-width:0; }
#appShell .topbar { padding-left:32px; padding-right:32px; }
#appShell .topbar .context-selector { flex-basis:100%; grid-template-columns:repeat(4,minmax(0,1fr)) !important; width:100%; min-width:0; }
#appShell .context-selector select { width:100%; min-width:0; }
#appShell .student-dashboard-grid { grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); }
#appShell .student-dashboard-grid > * { min-width:0; grid-column:auto; grid-row:auto; }
#appShell .report-actions > * { max-width:100%; }
@container (max-width:850px) {
  .cols-4,.cols-3,.cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .team-dashboard-hero .team-hero-header-row { grid-template-columns:1fr; }
}
@container (max-width:580px) {
  .cols-4,.cols-3,.cols-2 { grid-template-columns:minmax(0,1fr); }
  .report-fields { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:1000px) {
  #appShell .topbar .context-selector { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media(max-width:800px) {
  :root { --platform-gutter:16px; }
  #appShell > .main { width:100%; flex:auto; }
  #appShell > .sidebar { width:100%; min-width:0; }
  #appShell #content,#appShell .topbar { padding:24px 16px; }
}

.openteams-wordmark { grid-template-columns:max-content max-content; }
@media(max-width:480px) {
  #appShell .topbar .context-selector { grid-template-columns:minmax(0,1fr) !important; }
}

#appShell .risk-summary-grid { grid-template-columns:repeat(auto-fit,minmax(min(120px,100%),1fr)); }
#appShell .risk-metric { min-width:0; }

.openteams-wordmark .openteams-wordmark-teams { color:#fff; }

.openteams-wordmark .openteams-wordmark-teams { color:#fff; }