@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap');

/* Root Variables */
:root{
  --font-sans:'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --page-padding:24px;
  --card-gap:22px;
  --section-gap:28px;
  --field-gap:12px;

  --sidebar-width:232px;
  --sidebar-collapsed-width:74px;
  --sidebar-mobile-width:256px;
  --sidebar-margin:16px;
  --sidebar-header-height:62px;
  --topbar-height:62px;
  --content-top-padding:var(--sidebar-margin);
  --right-panel-width:280px;
  --topbar-x-padding:14px;
  --topbar-search-width:210px;
  --topbar-profile-width:220px;

  --radius-xs:8px;
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:22px;
  --radius-xl:28px;
  --radius-pill:999px;

  --primary:#3563a7;
  --primary-strong:#254f91;
  --primary-deep:#173a73;
  --primary-soft:#eaf3ff;
  --primary-soft-2:#dcecff;
  --primary-rgb:53,99,167;
  --primary-strong-rgb:37,79,145;

  --sky:#8fc5f6;
  --sky-soft:#f3f9ff;
  --blue-gray:#eef6ff;
  --page-bg:#eef6ff;
  --page-bg-2:#f8fbff;
  --surface:#ffffff;
  --surface-soft:#f9fcff;
  --surface-glass:rgba(255,255,255,.82);
  --surface-glass-strong:rgba(255,255,255,.92);
  --surface-muted:#f3f7fc;

  --text:#18233a;
  --text-soft:#46566f;
  --muted:#6d7d94;
  --muted-soft:#91a0b5;
  --border:#dbe8f6;
  --border-strong:#c6d8ec;
  --border-glass:rgba(255,255,255,.76);

  --success:#20875a;
  --success-bg:#e8f7ef;
  --success-border:#c8ead8;
  --warning:#a86613;
  --warning-bg:#fff4db;
  --warning-border:#f3ddb2;
  --danger:#bf3f4a;
  --danger-bg:#fff0f1;
  --danger-border:#f1c5ca;
  --info:#3563a7;
  --info-bg:#eaf3ff;
  --info-border:#c9def7;

  --shadow-xs:0 4px 14px rgba(39,68,112,.06);
  --shadow-sm:0 10px 26px rgba(39,68,112,.08);
  --shadow-md:0 18px 44px rgba(39,68,112,.10);
  --shadow-lg:0 24px 70px rgba(39,68,112,.13);
  --focus-ring:0 0 0 4px rgba(var(--primary-rgb),.14);
  --transition:160ms ease;
}

/* Base Reset */
*,
*::before,
*::after{box-sizing:border-box}

html{
  min-height:100%;
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}

body{
  min-height:100%;
  margin:0;
  overflow-x:hidden;
  color:var(--text);
  background:var(--page-bg-2);
}

a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{cursor:pointer}
button,input,select,textarea{font:inherit}
table{border-collapse:collapse}
[hidden]{display:none !important}

/* Typography */
body,
button,
input,
select,
textarea,
table{
  font-family:var(--font-sans);
  font-size:15px;
  line-height:1.55;
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,h4,
.section-title,
.brand-name,
.footer-brand-name{
  color:var(--text);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.18;
}

p{color:var(--text-soft)}
strong,b{font-weight:700}
small,.small{color:var(--muted);font-size:.85rem}
svg{display:block}

/* Scrollbars */
html,
body,
.sidebar,
.table-wrap,
.sidebar-nav{
  scrollbar-width:thin;
  scrollbar-color:rgba(var(--primary-rgb),.42) rgba(255,255,255,.46);
}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:rgba(255,255,255,.46);border-radius:var(--radius-pill)}
::-webkit-scrollbar-thumb{background:rgba(var(--primary-rgb),.36);border:2px solid rgba(255,255,255,.72);border-radius:var(--radius-pill)}
::-webkit-scrollbar-thumb:hover{background:rgba(var(--primary-rgb),.52)}
::-webkit-scrollbar-corner{background:transparent}

/* Layout */
.app-shell{
  min-height:100vh;
  width:100%;
}

.content-wrap{
  min-width:0;
  min-height:100vh;
  margin-left:calc(var(--sidebar-width) + var(--sidebar-margin));
  transition:margin-left var(--transition);
}

body.sidebar-collapsed .content-wrap{
  margin-left:calc(var(--sidebar-collapsed-width) + var(--sidebar-margin));
}

.content{
  width:100%;
  min-width:0;
  padding:var(--content-top-padding) var(--page-padding) var(--page-padding);
}

main,
#pageSearchRoot{
  min-width:0;
}

.page-body{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--section-gap);
  align-items:start;
}

.content.has-right-panel > main#pageSearchRoot > .page-body{
  grid-template-columns:minmax(0,1fr) var(--right-panel-width);
  gap:var(--section-gap);
}

.content.has-right-panel > main#pageSearchRoot > .page-body > .topbar.template-topbar{
  grid-column:1 / -1;
  width:100%;
  margin-bottom:0;
}

.main-column{
  min-width:0;
  display:grid;
  gap:var(--section-gap);
}

.right-column{
  min-width:0;
  display:grid;
  gap:var(--card-gap);
  align-self:start;
  position:sticky;
  top:calc(var(--content-top-padding) + var(--topbar-height) + var(--section-gap));
}

.grid{display:grid;gap:var(--card-gap)}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.inline-svg{display:inline-flex;align-items:center;justify-content:center}

/* Sidebar */
.sidebar{
  position:fixed;
  inset:var(--sidebar-margin) auto var(--sidebar-margin) var(--sidebar-margin);
  z-index:120;
  display:flex;
  flex-direction:column;
  width:var(--sidebar-width);
  min-width:var(--sidebar-width);
  max-width:var(--sidebar-width);
  height:calc(100vh - (var(--sidebar-margin) * 2));
  padding:12px 10px;
  overflow:visible;
  color:var(--text);
  background:rgba(255,255,255,.86);
  border:1px solid var(--border-glass);
  border-radius:0 var(--radius-lg) var(--radius-lg) 0;
  box-shadow:var(--shadow-lg);
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  transition:width var(--transition),min-width var(--transition),max-width var(--transition),transform var(--transition);
}

.sidebar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:transparent;
}

.sidebar-brand,
.sidebar-nav,
.sidebar-footer{
  position:relative;
  z-index:1;
}

.sidebar-brand{
  display:flex;
  align-items:center;
  gap:9px;
  height:var(--sidebar-header-height);
  min-height:var(--sidebar-header-height);
  padding:4px 5px 12px;
  margin-bottom:10px;
  border-bottom:1px solid var(--border);
  overflow:visible;
}

.sidebar-brand img{
  width:50px;
  height:38px;
  flex:0 0 50px;
  object-fit:cover;
  border-radius:var(--radius-sm);
  border:1px solid var(--border-glass);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
}

.sidebar-brand-text{
  min-width:0;
  display:grid;
  gap:2px;
}

.sidebar-brand strong,
.sidebar-brand small,
.nav-label,
.btn-label{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sidebar-brand strong{
  font-size:.95rem;
  color:var(--text);
}

.sidebar-brand small{
  font-size:.73rem;
  color:var(--muted);
}

.sidebar-nav{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  gap:5px;
  min-height:0;
  padding:2px 0 12px;
  overflow-y:auto;
  overflow-x:hidden;
}

.nav-link{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:7px 8px;
  border:1px solid transparent;
  border-radius:var(--radius-sm);
  color:var(--text-soft);
  background:transparent;
  font-size:.83rem;
  font-weight:600;
  line-height:1.12;
  transition:background var(--transition),border-color var(--transition),color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.nav-link .nav-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  flex:0 0 24px;
  border-radius:10px;
  color:var(--primary);
}

.nav-link .nav-icon svg{
  width:16px;
  height:16px;
}

.nav-link:hover{
  color:var(--primary-deep);
  background:rgba(234,243,255,.86);
  border-color:var(--border);
  transform:translateX(2px);
}

.nav-link.active{
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  border-color:rgba(255,255,255,.8);
  box-shadow:0 12px 24px rgba(var(--primary-strong-rgb),.20);
}

.nav-link.active .nav-icon{
  color:var(--surface);
}

.sidebar-footer{
  padding-top:10px;
  border-top:1px solid var(--border);
}

.sidebar-footer .btn{
  width:100%;
  min-height:38px;
  padding:7px 8px;
  border-radius:var(--radius-sm);
  white-space:nowrap;
  overflow:hidden;
}

.sidebar-collapse-btn{
  position:absolute;
  top:50%;
  right:-25px;
  z-index:12;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:25px;
  height:25px;
  padding:0;
  border:1px solid rgba(226,232,245,.78);
  border-radius:50px;
  background:rgba(255,255,255,.86);
  color:#000000;
  box-shadow:0 10px 24px rgba(24,34,77,.10), inset 0 1px 0 rgba(255,255,255,.82);
  cursor:e-resize;
  backdrop-filter:blur(16px) saturate(155%);
  -webkit-backdrop-filter:blur(16px) saturate(155%);
  transition:background-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease;
}

.sidebar-collapse-btn:hover{
  background:rgba(255,255,255,.96);
  color:var(--primary-deep);
  box-shadow:0 14px 28px rgba(24,34,77,.14), inset 0 1px 0 rgba(255,255,255,.92);
}

.sidebar-collapse-arrow{
  display:block;
  font-size:23px;
  line-height:1;
  font-weight:700;
  letter-spacing:0;
  transform:translateX(-1px) translateY(-1px);
}

.sidebar-collapse-btn.is-collapsed .sidebar-collapse-arrow{
  transform:translateX(1px) translateY(-1px) rotate(180deg);
}

body.sidebar-collapsed .sidebar{
  width:var(--sidebar-collapsed-width);
  min-width:var(--sidebar-collapsed-width);
  max-width:var(--sidebar-collapsed-width);
  padding-left:9px;
  padding-right:9px;
}

body.sidebar-collapsed .sidebar-brand{
  justify-content:center;
  padding-left:0;
  padding-right:0;
}

body.sidebar-collapsed .sidebar-brand img{
  width:calc(var(--sidebar-collapsed-width) - 18px);
  height:42px;
  flex-basis:calc(var(--sidebar-collapsed-width) - 18px);
  border-radius:var(--radius-sm);
}

body.sidebar-collapsed .sidebar-brand-text,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .btn-label{
  width:0;
  max-width:0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

body.sidebar-collapsed .sidebar-nav .nav-link,
body.sidebar-collapsed .sidebar-footer .btn{
  justify-content:center;
  gap:0;
  padding-left:0;
  padding-right:0;
}

/* Topbar */
.topbar.template-topbar{
  display:flex;
  position:sticky;
  top:var(--content-top-padding);
  z-index:80;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  min-height:var(--topbar-height);
  height:var(--sidebar-header-height);
  margin-bottom:var(--section-gap);
  padding:9px var(--topbar-x-padding);
  border:1px solid var(--border-glass);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(247,251,255,.78));
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}

.topbar.template-topbar .header-left,
.topbar.template-topbar .header-right{
  display:flex;
  align-items:center;
  min-width:0;
}

.topbar.template-topbar .header-left{
  gap:12px;
  flex:1 1 auto;
}

.header-right{
  gap:10px;
  flex:0 1 auto;
  margin-left:auto;
  justify-content:flex-end;
  flex-wrap:nowrap;
}

.topbar-title-wrap{
  min-width:0;
  display:grid;
  gap:2px;
}

.topbar.template-topbar h1{
  margin:0;
  max-width:100%;
  color:var(--text);
  font-size:1.22rem;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.topbar.template-topbar p{display:none}

.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--primary);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
}

.topbar-search{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  width:clamp(160px,16vw,var(--topbar-search-width));
  flex:0 1 var(--topbar-search-width);
  min-width:150px;
  height:42px;
  padding:0 10px 0 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--muted);
  background:var(--surface-glass);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), var(--shadow-xs);
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition);
}

.topbar-search:focus-within{
  border-color:rgba(var(--primary-rgb),.45);
  background:var(--surface);
  box-shadow:var(--focus-ring), var(--shadow-xs);
}

.search-pill-icon{display:inline-flex;color:var(--muted)}
.topbar-search input{
  width:100%;
  min-width:0;
  height:100%;
  border:0;
  outline:0;
  color:var(--text);
  background:transparent;
  font-size:.9rem;
}

.topbar-search input::placeholder{color:var(--muted-soft)}
.topbar-search input::-webkit-search-cancel-button{display:none}

.search-clear{
  display:none;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border:0;
  border-radius:var(--radius-pill);
  color:var(--primary);
  background:rgba(var(--primary-rgb),.10);
  font-size:1.1rem;
  line-height:1;
}

.search-clear.is-visible{display:inline-flex}

.topbar-calendar-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:42px;
  min-width:42px;
  flex:0 0 42px;
  height:42px;
  padding:0;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  font-size:.82rem;
  font-weight:800;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.topbar-calendar-link:hover{
  background:var(--surface);
  border-color:var(--border-strong);
  box-shadow:var(--shadow-sm);
  transform:translateY(-1px);
}

.topbar-calendar-link svg{
  color:var(--primary);
}

.icon-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--primary);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.icon-btn:hover{
  background:var(--surface);
  border-color:var(--border-strong);
  box-shadow:var(--shadow-sm);
  transform:translateY(-1px);
}

.icon-badge{
  position:absolute;
  top:-5px;
  right:-5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:var(--radius-pill);
  color:var(--surface);
  background:var(--danger);
  border:2px solid var(--surface);
  font-size:.65rem;
  font-weight:700;
}

.topbar-profile{
  display:flex;
  align-items:center;
  gap:9px;
  width:var(--topbar-profile-width);
  min-width:180px;
  max-width:var(--topbar-profile-width);
  flex:0 1 var(--topbar-profile-width);
  height:42px;
  padding:4px 12px 4px 5px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  overflow:hidden;
}

.topbar-profile-avatar{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  flex:0 0 32px;
  border-radius:var(--radius-pill);
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  font-size:.82rem;
  font-weight:700;
}

.topbar-profile-text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  line-height:1.08;
}

.topbar-profile-text strong,
.topbar-profile-text span{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.topbar-profile-text strong{
  color:var(--text);
  font-size:.82rem;
}

.topbar-profile-text span{
  margin-top:3px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:500;
}


/* Cards */
.card,
.template-stat,
.welcome-banner,
.table-wrap,
.msf-frame,
.auth-card,
.demo-box,
.res-card,
.role-profile-card{
  border:1px solid var(--border-glass);
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(247,251,255,.78));
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}

.card{
  padding:22px;
}

.card h3{
  margin:0 0 14px;
  color:var(--text);
  font-size:1rem;
  font-weight:700;
}

.card p{
  margin-bottom:10px;
}

.card .card-item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:15px 0;
  border-bottom:1px solid var(--border);
}

.card .card-item:first-of-type{padding-top:4px}
.card .card-item:last-child{border-bottom:0;padding-bottom:0}

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

.section-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:1rem;
}

.see-all{
  color:var(--primary);
  font-size:.82rem;
  font-weight:700;
}

.card-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-shrink:0;
}

.btn-card-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  font-size:.72rem;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.btn-card-action:hover{
  background:var(--surface);
  border-color:var(--border-strong);
  box-shadow:var(--shadow-sm);
  transform:translateY(-1px);
}

.item-icon,
.icon-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  flex-shrink:0;
  border-radius:var(--radius-sm);
  color:var(--primary);
  background:var(--primary-soft);
}

.item-icon.success{color:var(--success);background:var(--success-bg)}
.item-icon.warning{color:var(--warning);background:var(--warning-bg)}
.item-icon.info{color:var(--info);background:var(--info-bg)}

.item-body{min-width:0}
.item-title{
  color:var(--text);
  font-size:.94rem;
  font-weight:700;
  line-height:1.35;
}

.item-desc{
  margin-top:2px;
  color:var(--text-soft);
  font-size:.86rem;
  line-height:1.55;
}

.item-time{
  margin-top:7px;
  color:var(--muted);
  font-size:.74rem;
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 16px;
  border:1px solid transparent;
  border-radius:var(--radius-sm);
  font-weight:700;
  line-height:1.15;
  text-align:center;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),color var(--transition),transform var(--transition);
}

.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:0;box-shadow:var(--focus-ring)}
.btn-block{width:100%}

.btn-primary,
.btn-login{
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  border-color:rgba(255,255,255,.76);
  box-shadow:0 12px 24px rgba(var(--primary-strong-rgb),.22);
}

.btn-primary:hover,
.btn-login:hover{
  background:linear-gradient(135deg,var(--primary-strong),var(--primary-deep));
}

.btn-outline{
  color:var(--primary-deep);
  background:var(--surface-glass);
  border-color:var(--border);
  box-shadow:var(--shadow-xs);
}

.btn-outline:hover{
  background:var(--surface);
  border-color:var(--border-strong);
}

.btn-danger{
  color:var(--surface);
  background:var(--danger);
  border-color:var(--danger);
  box-shadow:0 12px 22px rgba(191,63,74,.16);
}

.btn-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Badges and Messages */
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border:1px solid transparent;
  border-radius:var(--radius-pill);
  font-size:.75rem;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
}

.badge-default{color:var(--text-soft);background:var(--surface-muted);border-color:var(--border)}
.badge-info{color:var(--info);background:var(--info-bg);border-color:var(--info-border)}
.badge-warning{color:var(--warning);background:var(--warning-bg);border-color:var(--warning-border)}
.badge-success{color:var(--success);background:var(--success-bg);border-color:var(--success-border)}
.badge-danger{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}

.flash,
.alert{
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:13px 16px;
  color:var(--text);
  background:var(--surface-glass-strong);
  box-shadow:var(--shadow-sm);
}

.flash{
  position:fixed;
  top:18px;
  right:18px;
  z-index:250;
  max-width:min(420px,calc(100vw - 36px));
  margin:0;
  font-size:.92rem;
}

.flash-success{color:var(--success);background:var(--success-bg);border-color:var(--success-border)}
.flash-danger{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}
.flash-warning,
.alert-warning{color:var(--warning);background:var(--warning-bg);border-color:var(--warning-border)}

.global-search-empty{
  margin-top:var(--card-gap);
  color:var(--muted);
  font-weight:700;
  text-align:center;
}

/* Dashboard */
.dashboard-grid{
  display:grid;
  gap:var(--card-gap);
}

.welcome-banner{
  position:relative;
  min-height:164px;
  padding:30px 34px;
  overflow:hidden;
  background:
    radial-gradient(circle at 86% 28%,rgba(220,236,255,.82),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(239,247,255,.82));
}

.welcome-banner h2{
  margin:0 0 14px;
  font-size:1.55rem;
}

.welcome-banner p{
  max-width:540px;
  margin:0;
  color:var(--text-soft);
  font-size:.92rem;
}

.welcome-banner-blob2{
  position:absolute;
  right:52px;
  bottom:-70px;
  width:190px;
  height:190px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(var(--primary-rgb),.10),transparent 68%);
  pointer-events:none;
}

.mood-checkin{
  position:relative;
  z-index:1;
  margin-top:8px;
}

.mood-checkin-label{
  margin-bottom:10px;
  color:var(--text-soft);
  font-size:.84rem;
  font-weight:700;
}

.mood-options{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}

.mood-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:36px;
  padding:7px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  font-size:.82rem;
  font-weight:700;
}

.mood-icon{display:inline-flex;width:16px;height:16px}

.template-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--card-gap);
}

.template-stat{
  min-height:148px;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

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

.template-stat .label{
  color:var(--muted);
  font-size:.77rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.045em;
}

.template-stat .value{
  margin-top:10px;
  color:var(--text);
  font-size:2.12rem;
  font-weight:800;
  line-height:1;
  letter-spacing:-.05em;
}

.template-stat .sub{
  margin-top:12px;
  color:var(--text-soft);
  font-size:.82rem;
  line-height:1.45;
}

/* Calendar */
.dashboard-calendar-card{
  padding:16px;
  overflow:hidden;
}

.calendar-widget-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.calendar-widget-subtitle{
  margin:3px 0 0;
  color:var(--muted);
  font-size:.76rem;
  line-height:1.35;
}

.calendar-widget-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
}

.calendar-widget-toolbar strong{
  color:var(--text);
  font-size:.9rem;
  font-weight:700;
  text-align:center;
}

.calendar-today-btn,
.calendar-nav-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  color:var(--primary);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  transition:background var(--transition),border-color var(--transition),transform var(--transition);
}

.calendar-today-btn{
  min-height:30px;
  padding:0 10px;
  border-radius:var(--radius-pill);
  font-size:.72rem;
  font-weight:700;
}

.calendar-nav-btn{
  width:30px;
  height:30px;
  border-radius:var(--radius-sm);
  font-size:1rem;
  line-height:1;
  font-weight:700;
}

.calendar-today-btn:hover,
.calendar-nav-btn:hover{
  background:var(--surface);
  border-color:var(--border-strong);
  transform:translateY(-1px);
}

.calendar-weekdays,
.calendar-days{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:4px;
}

.calendar-weekdays{margin-bottom:6px}

.calendar-weekdays span{
  color:var(--muted);
  font-size:.62rem;
  font-weight:800;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.calendar-day{
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  height:30px;
  border:1px solid transparent;
  border-radius:10px;
  color:var(--text);
  background:transparent;
  font-size:.75rem;
  font-weight:700;
  transition:background var(--transition),border-color var(--transition),color var(--transition),transform var(--transition),box-shadow var(--transition);
}

.calendar-day:hover{
  background:var(--surface-glass);
  border-color:var(--border);
  transform:translateY(-1px);
}

.calendar-day.is-muted{color:var(--muted-soft)}
.calendar-day.is-today{
  color:var(--primary-deep);
  background:var(--primary-soft);
  border-color:var(--info-border);
}

.calendar-day.is-selected{
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  border-color:transparent;
  box-shadow:0 10px 18px rgba(var(--primary-strong-rgb),.18);
}

.calendar-day.has-events::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:3px;
  width:4px;
  height:4px;
  border-radius:var(--radius-pill);
  background:var(--primary);
  transform:translateX(-50%);
}

.calendar-day.is-selected.has-events::after{background:var(--surface)}

.calendar-selected-panel{
  margin-top:12px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.72);
}

.calendar-selected-panel strong{
  display:block;
  margin-bottom:7px;
  color:var(--text);
  font-size:.8rem;
}

.calendar-selected-events{
  display:grid;
  gap:7px;
  color:var(--muted);
  font-size:.78rem;
  line-height:1.35;
}

.calendar-event-pill{
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text);
  background:var(--primary-soft);
}

.calendar-event-pill span{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:.7rem;
}

/* Forms */
.input-shell,
.form-group{
  display:grid;
  gap:8px;
}

.input-shell label,
.form-group label,
.msf-question-label{
  color:var(--text);
  font-size:.94rem;
  font-weight:700;
}

.form-body{
  display:grid;
  gap:var(--field-gap);
}

.filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:16px;
}

.filters input,
.filters select,
.filters textarea,
.input-shell input,
.input-shell select,
.input-shell textarea,
.form-group input,
.form-group select,
.form-group textarea,
input[type="datetime-local"],
td form select,
td form textarea,
td form input[type="datetime-local"]{
  width:100%;
  min-height:42px;
  padding:11px 13px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  color:var(--text);
  background:var(--surface);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  transition:border-color var(--transition),box-shadow var(--transition),background var(--transition);
}

.filters input,
.filters select{
  max-width:260px;
}

.filters input:focus,
.filters select:focus,
.filters textarea:focus,
.input-shell input:focus,
.input-shell select:focus,
.input-shell textarea:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
input[type="datetime-local"]:focus,
td form select:focus,
td form textarea:focus,
td form input[type="datetime-local"]:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.62);
  background:var(--surface);
  box-shadow:var(--focus-ring);
}

.form-group textarea,
.input-shell textarea,
td form textarea{
  min-height:112px;
  resize:vertical;
}

td form{gap:8px}

.msf-page{width:100%;padding:10px 0 34px}

.msf-frame{
  width:min(100%,920px);
  margin:0 auto;
  overflow:hidden;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:26px;
  background:rgba(255,255,255,.88);
  box-shadow:0 24px 70px rgba(47,91,148,.14);
}

.msf-progress{height:6px;background:#e8f1ff}
.msf-progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--sky));transition:width 240ms ease}
.msf-form{display:block}
.msf-intro-section,.msf-section{display:none}
.msf-intro-section.is-active,.msf-section.is-active{display:block;animation:msfFadeUp .25s ease both}

@keyframes msfFadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.msf-intro{
  min-height:360px;
  padding:54px 42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  text-align:left;
  color:var(--text);
  background:radial-gradient(circle at 100% 0%,rgba(var(--primary-rgb),.16),transparent 32%),linear-gradient(180deg,#fbfdff 0%,#edf6ff 100%);
}

.msf-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  margin-bottom:18px;
  border:1px solid rgba(var(--primary-rgb),.18);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:rgba(var(--primary-rgb),.08);
  font-size:.82rem;
  font-weight:800;
}

.msf-intro h2{max-width:720px;margin:0 0 14px;color:var(--text);font-size:clamp(1.7rem,3vw,2.35rem);line-height:1.1;letter-spacing:-.04em}
.msf-intro p{max-width:700px;margin:0;color:var(--text-soft);line-height:1.75;font-size:1rem}
.msf-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.msf-meta span{display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border:1px solid rgba(var(--primary-rgb),.14);border-radius:var(--radius-pill);color:var(--primary-deep);background:rgba(255,255,255,.74);font-size:.82rem;font-weight:800}

.msf-intro-actions,
.msf-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:18px 24px;
  border-top:1px solid var(--border);
  background:rgba(248,251,255,.92);
}

.msf-actions{position:sticky;bottom:0;z-index:20;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.msf-actions.is-hidden,.msf-questions-wrap{display:none}
.msf-questions-wrap.is-active{display:block}
.msf-actions-left,.msf-actions-right{display:flex;align-items:center;gap:10px}
.msf-progress-text{color:var(--muted);font-size:.9rem;font-weight:800}

.msf-section-nav{display:flex;gap:8px;padding:18px 22px 0;overflow-x:auto;scrollbar-width:thin}
.msf-section-pill{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;padding:9px 13px;border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text-soft);background:var(--surface);font:inherit;font-size:.82rem;font-weight:800;cursor:pointer;transition:background var(--transition),border-color var(--transition),color var(--transition),box-shadow var(--transition)}
.msf-section-pill span{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:.74rem}
.msf-section-pill.is-active{color:var(--primary-deep);border-color:rgba(var(--primary-rgb),.3);background:var(--primary-soft);box-shadow:var(--shadow-xs)}
.msf-section-pill.is-complete span{color:var(--surface);background:var(--primary)}

.msf-section{padding:28px 28px 34px;background:rgba(255,255,255,.86)}
.msf-section-head{margin-bottom:22px;padding:0 4px 18px;border-bottom:1px solid var(--border)}
.msf-section-head h3{margin:0 0 8px;color:var(--text);font-size:1.28rem;letter-spacing:-.02em}
.msf-section-head p{max-width:780px;margin:0;color:var(--text-soft);line-height:1.6}
.msf-question-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}

.msf-question{display:grid;gap:10px;padding:20px;border:1px solid rgba(var(--primary-rgb),.11);border-radius:20px;background:rgba(255,255,255,.96);box-shadow:0 10px 28px rgba(47,91,148,.07);transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition)}
.msf-question:hover{border-color:rgba(var(--primary-rgb),.22);box-shadow:0 16px 36px rgba(47,91,148,.1)}
.msf-question.full{grid-column:1/-1}
.msf-question.has-error,.msf-likert-table tr.has-error{border-color:rgba(196,48,61,.45);background:#fff8f8}
.msf-question-label{display:flex;align-items:center;gap:4px;margin:0;color:var(--text);line-height:1.35}
.msf-required{color:var(--danger)}

.msf-input{width:100%;min-height:46px;padding:12px 2px 10px;border:0;border-bottom:2px solid var(--border-strong);border-radius:0;color:var(--text);background:transparent;font:inherit;outline:0;transition:border-color var(--transition),box-shadow var(--transition),background var(--transition),padding var(--transition)}
select.msf-input{padding:12px 10px;border:1px solid var(--border-strong);border-radius:14px;background:#fff}
.msf-input:focus{border-color:var(--primary);box-shadow:0 8px 0 -6px rgba(var(--primary-rgb),.16)}
.msf-question.is-prefilled .msf-input{padding-left:12px;padding-right:12px;border:1px solid rgba(var(--primary-rgb),.18);border-radius:14px;background:#f3f8ff}
textarea.msf-input{min-height:118px;padding:12px 2px;resize:vertical}

.msf-note{border-style:dashed;background:linear-gradient(135deg,rgba(var(--primary-rgb),.08),rgba(255,255,255,.96))}
.msf-note strong{display:block;margin-bottom:6px;color:var(--primary-deep);font-size:.98rem}
.msf-note p{margin:0;color:var(--text-soft);line-height:1.65}
.msf-hint,.msf-error{min-height:18px;color:var(--muted);font-size:.8rem;line-height:1.45}
.msf-prefill-hint{color:var(--primary);font-weight:700}
.msf-error{color:var(--danger);font-weight:700}

.msf-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.msf-option-card{position:relative;display:flex;align-items:center;gap:12px;min-height:48px;padding:13px 14px;border:1px solid var(--border);border-radius:15px;color:var(--text);background:var(--surface);cursor:pointer;transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition)}
.msf-option-card:hover{transform:translateY(-1px)}
.msf-option-card:hover,.msf-option-card.is-selected{border-color:rgba(var(--primary-rgb),.55);background:var(--primary-soft);box-shadow:var(--shadow-xs)}
.msf-option-card input{flex-shrink:0;width:18px;height:18px;accent-color:var(--primary)}
.msf-checkbox-card input{border-radius:4px}

.msf-rating{display:flex;flex-wrap:wrap;gap:9px}
.msf-rating-item{position:relative}
.msf-rating-item input{position:absolute;opacity:0;pointer-events:none}
.msf-rating-item span{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--border);border-radius:14px;color:var(--muted);background:var(--surface);font-weight:800;cursor:pointer;transition:background var(--transition),border-color var(--transition),color var(--transition),box-shadow var(--transition),transform var(--transition)}
.msf-rating-item input:checked + span,.msf-rating-item span:hover{color:var(--surface);border-color:var(--primary);background:var(--primary);box-shadow:var(--shadow-xs);transform:translateY(-1px)}
.msf-rating-scale{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;color:var(--muted);font-size:.78rem}
.msf-rating-scale span{padding:6px 9px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface-soft)}

.msf-likert-wrap{width:100%;overflow-x:auto;border:1px solid var(--border);border-radius:18px;background:#fff}
.msf-likert-table{width:100%;min-width:760px;border-collapse:separate;border-spacing:0}
.msf-likert-table th,.msf-likert-table td{padding:14px 12px;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle}
.msf-likert-table th{position:sticky;top:0;z-index:1;color:var(--primary-deep);background:#f4f8ff;font-size:.78rem;line-height:1.25}
.msf-likert-table th:first-child,.msf-likert-statement{width:34%;text-align:left}
.msf-likert-table tbody tr:last-child td{border-bottom:0}
.msf-likert-table tbody tr:hover{background:#f8fbff}
.msf-likert-table tbody tr.is-answered .msf-likert-statement{color:var(--text);font-weight:700}
.msf-likert-choice{display:inline-flex;align-items:center;justify-content:center;width:100%;cursor:pointer}
.msf-likert-choice input{position:absolute;opacity:0;pointer-events:none}
.msf-likert-choice span{width:22px;height:22px;border:2px solid #bfd0e8;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 5px #fff;transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition)}
.msf-likert-choice:hover span,.msf-likert-choice input:checked + span{border-color:var(--primary);background:var(--primary);box-shadow:inset 0 0 0 5px #fff,0 0 0 4px rgba(var(--primary-rgb),.12);transform:scale(1.05)}

.msf-upload{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:18px;border:2px dashed rgba(var(--primary-rgb),.28);border-radius:18px;background:#f7fbff;text-align:center;cursor:pointer}
.msf-upload input{position:absolute;opacity:0;pointer-events:none}
.msf-upload-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:999px;color:#fff;background:var(--primary);font-size:1.4rem;font-weight:800}

.msf-submit.is-hidden,.msf-prev.is-hidden{display:none}
.msf-save-draft.is-saved{border-color:rgba(var(--primary-rgb),.4);color:var(--primary);background:var(--primary-soft)}
.msf-submit.is-loading{pointer-events:none;opacity:.8}

.msf-state-card{display:grid;justify-items:center;gap:14px;padding:46px 34px;text-align:center}
.msf-state-icon,.guidance-modal-icon{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:999px;color:#fff;background:var(--primary);font-size:1.8rem;font-weight:900;box-shadow:0 16px 30px rgba(var(--primary-rgb),.25)}
.msf-state-card h2{margin:0;color:var(--text);font-size:1.55rem}
.msf-state-card p{max-width:650px;margin:0;color:var(--text-soft);line-height:1.65}
.msf-state-muted{color:var(--muted)!important}
.msf-state-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:6px}

.guidance-modal-overlay{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(18,38,66,.36);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.guidance-modal-overlay.is-visible{display:flex;animation:msfFadeUp .18s ease both}
.guidance-modal{width:min(100%,460px);display:grid;justify-items:center;gap:12px;padding:30px;border:1px solid rgba(255,255,255,.7);border-radius:24px;background:#fff;box-shadow:0 30px 80px rgba(21,42,72,.22);text-align:center}
.guidance-modal h2{margin:4px 0 0;color:var(--text)}
.guidance-modal p{margin:0 0 8px;color:var(--text-soft);line-height:1.6}
.guidance-modal-overlay.is-danger .guidance-modal-icon{background:var(--danger)}

body.form-focus .sidebar{
  display:flex;
  width:var(--sidebar-collapsed-width);
  min-width:var(--sidebar-collapsed-width);
  max-width:var(--sidebar-collapsed-width);
  padding-left:9px;
  padding-right:9px;
}
body.form-focus .content-wrap{
  width:auto;
  margin-left:calc(var(--sidebar-collapsed-width) + var(--sidebar-margin));
}
body.form-focus .content{padding:var(--page-padding)}
body.form-focus .sidebar-brand{
  justify-content:center;
  padding-left:0;
  padding-right:0;
}
body.form-focus .sidebar-brand img{
  width:calc(var(--sidebar-collapsed-width) - 18px);
  height:42px;
  flex-basis:calc(var(--sidebar-collapsed-width) - 18px);
  border-radius:var(--radius-sm);
}
body.form-focus .sidebar-brand-text,
body.form-focus .nav-label,
body.form-focus .btn-label{
  width:0;
  max-width:0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
body.form-focus .sidebar-nav .nav-link,
body.form-focus .sidebar-footer .btn{
  justify-content:center;
  gap:0;
  padding-left:0;
  padding-right:0;
}

/* Tables */
.table-wrap{
  width:100%;
  overflow:auto;
  margin-top:8px;
  border-radius:var(--radius-md);
}

.table-wrap table{
  width:100%;
  min-width:760px;
  border-collapse:separate;
  border-spacing:0;
}

th,
td{
  padding:13px 12px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  text-align:left;
  vertical-align:top;
  font-size:.88rem;
}

th{
  position:sticky;
  top:0;
  z-index:2;
  color:var(--muted);
  background:rgba(239,247,255,.94);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

tbody tr:last-child td{border-bottom:0}
.table-wrap tbody tr{
  transition:background var(--transition);
}

.table-wrap tbody tr:hover{
  background:rgba(234,243,255,.58);
}

td details summary{
  color:var(--primary);
  font-weight:700;
  cursor:pointer;
}

td pre{
  max-width:420px;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text-soft);
  background:var(--surface-soft);
  overflow:auto;
}

/* Profile Pages */
.role-profile-page{
  display:grid;
  gap:var(--card-gap);
}

.role-profile-layout{
  display:grid;
  grid-template-columns:380px minmax(0,1fr);
  gap:var(--card-gap);
  align-items:start;
}

.role-profile-left,
.role-profile-right{
  display:grid;
  gap:var(--card-gap);
}

.role-profile-card{
  overflow:hidden;
}

.role-profile-main-card{
  text-align:center;
}

.role-profile-banner{
  position:relative;
  height:126px;
  overflow:hidden;
}

.role-profile-gradient{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 22% 20%,rgba(255,255,255,.24),transparent 26%),
    linear-gradient(135deg,var(--sky),var(--primary));
}

.role-profile-avatar{
  position:relative;
  z-index:1;
  width:106px;
  height:106px;
  margin:-55px auto 0;
  overflow:hidden;
  border:5px solid var(--surface);
  border-radius:var(--radius-pill);
  background:var(--surface-muted);
  box-shadow:var(--shadow-sm);
}

.role-profile-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.role-profile-main-info{
  padding:26px 28px 30px;
}

.role-profile-main-info h2{
  margin:0 0 8px;
  color:var(--text);
  font-size:1.35rem;
}

.role-profile-main-info p{
  max-width:290px;
  margin:0 auto 20px;
  color:var(--text-soft);
  font-size:.94rem;
}

.role-profile-edit,
.role-section-head a{
  color:var(--primary);
  font-size:.9rem;
  font-weight:700;
}

.role-profile-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--border);
}

.role-profile-stats div{
  padding:20px 10px 18px;
  border-right:1px solid var(--border);
}

.role-profile-stats div:last-child{border-right:0}
.role-profile-stats strong{
  display:block;
  color:var(--primary-deep);
  font-size:1.5rem;
  line-height:1;
}

.role-profile-stats span{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:.8rem;
}

.role-contact-card,
.role-info-card,
.role-security-card{
  padding:22px;
}

.role-contact-card h2,
.role-info-card h2,
.role-security-card h2{
  margin:0;
  color:var(--text);
  font-size:1.14rem;
  font-weight:700;
}

.role-contact-list{
  display:grid;
  gap:14px;
  margin-top:20px;
}

.role-contact-list div{
  display:flex;
  align-items:flex-start;
  gap:12px;
  color:var(--text-soft);
  font-size:.94rem;
}

.role-contact-list svg{
  flex:0 0 auto;
  color:var(--primary);
  margin-top:2px;
}

.role-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}

.role-info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px 48px;
}

.role-info-field span{
  display:block;
  margin-bottom:7px;
  color:var(--muted);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.role-info-field strong{
  display:block;
  color:var(--text);
  font-size:1rem;
  line-height:1.35;
}

.role-security-form{
  display:grid;
  gap:12px;
  max-width:560px;
  margin-top:22px;
}

.role-password-row{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:12px;
  align-items:center;
}

.role-password-row label{
  color:var(--text);
  font-size:.95rem;
  font-weight:700;
}

.role-password-row input{
  min-height:40px;
  padding:10px 12px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
}

.role-password-row input:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.62);
  box-shadow:var(--focus-ring);
}

.role-security-note{
  margin:10px 0 0;
  color:var(--muted);
  font-size:.82rem;
}

/* Landing Page */
.landing{
  min-height:100vh;
  background:linear-gradient(180deg,var(--page-bg-2),var(--page-bg));
}

.navbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:100%;
  padding:18px 28px;
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.brand-texts{
  display:flex;
  flex-direction:column;
  min-width:0;
  line-height:1.22;
}

.brand-name{color:var(--primary-deep)}
.brand-sub{color:var(--muted);font-size:.85rem}
.nav-right{
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
}

.nav-faqs{
  color:var(--primary-deep);
  font-weight:700;
}

.btn-login{
  min-height:42px;
  padding:11px 18px;
  border-radius:var(--radius-sm);
}

.hero-section{padding:28px}
.hero-card{
  position:relative;
  min-height:470px;
  overflow:hidden;
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
}

.hero-img{
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(23,58,115,.24),rgba(23,58,115,.36)),url('https://images.unsplash.com/photo-1523240795612-9a054b0db644?w=1600&q=80&auto=format&fit=crop');
  background-size:cover;
  background-position:center;
  transition:transform var(--transition);
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(23,58,115,.58),rgba(23,58,115,.08));
}

.hero-content{
  position:relative;
  z-index:2;
  min-height:470px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:72px 60px;
}

.hero-text{
  max-width:820px;
  margin:0 0 24px;
  color:var(--surface);
  font-size:clamp(1.45rem,3vw,2rem);
  font-weight:700;
  line-height:1.45;
}

.btn-started{
  display:inline-flex;
  align-self:flex-start;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:12px 20px;
  border-radius:var(--radius-sm);
  color:var(--primary-deep);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
  font-weight:800;
}

.featured-section,
.resources-section{
  padding:0 28px 28px;
}

.feat-header,
.res-top{
  margin-bottom:18px;
  text-align:center;
}

.feat-title{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
  font-weight:800;
}

.fb-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
  color:var(--primary-deep);
  font-weight:700;
}

.fb-circle{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:var(--radius-pill);
  color:var(--primary);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
}

.feat-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--card-gap);
}

.feat-card{
  position:relative;
  min-height:260px;
  overflow:hidden;
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-md);
}

.feat-card-img{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
}

.feat-card-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent,rgba(23,58,115,.72));
}

.feat-card-body{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  height:100%;
  padding:22px;
  color:var(--surface);
}

.feat-card-title{
  margin-bottom:8px;
  color:var(--surface);
  font-size:1.1rem;
  font-weight:800;
}

.feat-card-desc{
  color:rgba(255,255,255,.9);
  font-size:.9rem;
  line-height:1.6;
}

.res-title{
  margin:0 0 8px;
  color:var(--primary-deep);
  font-size:2rem;
}

.res-sub{
  max-width:720px;
  margin:0 auto;
  color:var(--text-soft);
  line-height:1.7;
}

.res-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--card-gap);
  margin-top:18px;
}

.res-card{
  padding:22px;
}

.res-badge{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.res-badge-sq{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:var(--radius-sm);
  color:var(--primary);
  background:var(--primary-soft);
}

.res-badge-pill{
  padding:9px 13px;
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--surface-muted);
  font-size:.9rem;
  font-weight:800;
}

.res-desc{
  margin:0;
  color:var(--text-soft);
  line-height:1.7;
}

.footer{
  margin-top:10px;
  padding:30px 28px;
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary-deep),var(--primary));
}

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

.footer-brand-top{
  display:flex;
  align-items:center;
  gap:12px;
}

.footer-brand-name,
.footer-col-title{
  color:var(--surface);
  font-weight:800;
}

.footer-brand-sub,
.footer-desc,
.footer-links{
  color:rgba(255,255,255,.84);
}

.footer-desc{
  max-width:560px;
  margin:12px 0 0;
}

.footer-col-title{margin-bottom:12px}
.footer-links{
  display:grid;
  gap:9px;
  font-size:.92rem;
}

/* Login Page */
.auth-wrap{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px;
  background:
    radial-gradient(circle at 20% 12%,rgba(255,255,255,.92),transparent 30%),
    linear-gradient(180deg,var(--page-bg),var(--page-bg-2));
}

.auth-card{
  width:min(540px,100%);
  padding:30px;
}

.auth-brand{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:20px;
}

.auth-brand img{
  width:74px;
  height:50px;
  object-fit:cover;
  border-radius:var(--radius-sm);
}

.auth-card h1{
  margin:0 0 8px;
  color:var(--primary-deep);
  font-size:1.9rem;
}

.auth-card p{
  margin:0 0 18px;
  color:var(--text-soft);
}

.auth-form{
  display:grid;
  gap:14px;
}

.demo-box{
  margin-top:18px;
  padding:16px;
}

/* Responsive Styles */
@media (max-width:1180px){
  :root{
    --page-padding:20px;
    --section-gap:22px;
    --card-gap:18px;
    --right-panel-width:260px;
    --topbar-search-width:190px;
    --topbar-profile-width:210px;
  }

  .content.has-right-panel > main#pageSearchRoot > .page-body{
    grid-template-columns:minmax(0,1fr) var(--right-panel-width);
  }

  .topbar-search{
    width:clamp(150px,18vw,var(--topbar-search-width));
  }

  .topbar-profile{
    width:var(--topbar-profile-width);
    min-width:170px;
    max-width:var(--topbar-profile-width);
  }

  .role-profile-layout{
    grid-template-columns:340px minmax(0,1fr);
  }

  .role-info-grid{
    gap:22px 34px;
  }
}

@media (max-width:1024px){
  .template-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .content.has-right-panel > main#pageSearchRoot > .page-body{
    grid-template-columns:1fr;
  }

  .right-column{
    position:static;
  }

  .msf-question-grid,
  .msf-option-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:900px){
  .role-profile-layout{
    grid-template-columns:1fr;
  }

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

@media (max-width:840px){
  :root{
    --page-padding:16px;
    --content-top-padding:16px;
    --section-gap:18px;
    --card-gap:16px;
  }

  body.sidebar-open{
    overflow:hidden;
  }

  body.sidebar-open::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:100;
    background:rgba(15,31,58,.25);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
  }

  .sidebar{
    inset:10px auto 10px 10px;
    width:var(--sidebar-mobile-width);
    min-width:var(--sidebar-mobile-width);
    max-width:var(--sidebar-mobile-width);
    height:auto;
    min-height:0;
    border-radius:var(--radius-lg);
    transform:translateX(calc(-100% - 20px));
  }

  body.sidebar-open .sidebar{
    transform:translateX(0);
  }

  .sidebar-collapse-btn{display:none}

  body.sidebar-collapsed .sidebar{
    width:var(--sidebar-mobile-width);
    min-width:var(--sidebar-mobile-width);
    max-width:var(--sidebar-mobile-width);
  }

  body.sidebar-collapsed .sidebar-brand-text,
  body.sidebar-collapsed .nav-label,
  body.sidebar-collapsed .btn-label{
    width:auto;
    max-width:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  body.sidebar-collapsed .sidebar-nav .nav-link,
  body.sidebar-collapsed .sidebar-footer .btn{
    justify-content:flex-start;
    gap:7px;
    padding-left:8px;
    padding-right:8px;
  }

  .content-wrap,
  body.sidebar-collapsed .content-wrap{
    margin-left:0;
  }

  .menu-toggle{display:inline-flex}

  .topbar.template-topbar{
    height:auto;
    flex-wrap:wrap;
    padding:10px 12px;
  }

  .topbar.template-topbar .header-right{
    width:100%;
    justify-content:flex-end;
    flex-wrap:wrap;
  }

  .topbar-search{
    order:3;
    width:100%;
    min-width:0;
    flex:1 1 100%;
  }

  .topbar-profile{
    min-width:0;
    max-width:none;
    flex:1 1 auto;
  }

  .filters input,
  .filters select,
  .filters textarea,
  .filters .btn{
    max-width:none;
    width:100%;
  }

  .feat-cards,
  .res-row,
  .footer-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:767px){
  .msf-frame{
    max-width:100%;
  }

  .msf-intro{
    min-height:280px;
    padding:34px 20px;
  }

  .msf-intro h2{
    font-size:1.55rem;
  }

  .msf-intro-actions,
  .msf-actions{
    flex-direction:column;
    align-items:stretch;
    padding:16px;
  }

  .msf-actions-left,
  .msf-actions-right{
    width:100%;
    flex-direction:column;
    align-items:stretch;
  }

  .msf-section{
    padding:20px 16px 24px;
  }

  .role-profile-left,
  .role-info-grid{
    grid-template-columns:1fr;
  }

  .role-password-row{
    grid-template-columns:1fr;
    gap:7px;
  }

  .hero-section,
  .featured-section,
  .resources-section{
    padding-left:18px;
    padding-right:18px;
  }

  .hero-content{
    padding:48px 28px;
  }

  .navbar{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (max-width:640px){
  :root{
    --page-padding:12px;
    --content-top-padding:12px;
    --section-gap:16px;
    --card-gap:14px;
  }

  .content{
    padding:var(--page-padding);
  }

  .topbar.template-topbar h1{
    font-size:1.12rem;
  }

  .template-stats,
  .grid-2{
    grid-template-columns:1fr;
  }

  .welcome-banner{
    min-height:auto;
    padding:24px 20px;
  }

  .template-stat{
    min-height:auto;
  }

  .card,
  .role-contact-card,
  .role-info-card,
  .role-security-card{
    padding:18px;
  }

  .calendar-day{
    height:28px;
    font-size:.72rem;
  }

  .res-title{
    font-size:1.55rem;
  }

  .hero-card,
  .hero-content{
    min-height:390px;
  }
}

@media (max-width:520px){
  .topbar-calendar-link{
    width:42px;
    padding:0;
  }

  .topbar-calendar-link span{
    display:none;
  }

  .topbar-profile{
    flex:0 0 44px;
    width:44px;
    justify-content:center;
    padding:5px;
  }

  .topbar-profile-text{
    display:none;
  }

  .nav-right{
    width:100%;
    justify-content:space-between;
  }

  .hero-content{
    padding:38px 22px;
  }

  .flash{
    left:12px;
    right:12px;
    max-width:none;
  }
}

/* Modal Utilities */
.modal-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:var(--page-padding);
  background:rgba(14,25,45,.58);
  backdrop-filter:blur(20px) saturate(130%);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
}

.modal-overlay.is-open{
  display:flex !important;
}

body.modal-open{
  overflow:hidden;
}

.modal-card{
  width:min(480px,100%);
  max-height:calc(100vh - (var(--page-padding) * 2));
  overflow:auto;
  padding:22px;
  border:1px solid var(--border-glass);
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.96));
  box-shadow:0 28px 90px rgba(12,31,63,.28);
}

.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.modal-head h2{
  margin:0 0 5px;
  color:var(--text);
  font-size:1.1rem;
}

.modal-head p{
  margin:0;
  color:var(--muted);
  font-size:.86rem;
}

.modal-close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary);
  background:var(--surface-glass);
  font-size:1.2rem;
  line-height:1;
}

.modal-form{
  display:grid;
  gap:14px;
}

.modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:4px;
}

@media (max-width:520px){
  .modal-actions{
    flex-direction:column-reverse;
  }

  .modal-actions .btn{
    width:100%;
  }
}

/* Interactive Calendar and Announcements Enhancements */
.section-title-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:color var(--transition), transform var(--transition);
}
.section-title-link:hover{color:var(--primary);transform:translateY(-1px)}
.page-body-single{grid-template-columns:1fr !important}

.notif-menu{position:relative;display:inline-flex;align-items:center;flex:0 0 auto}
.icon-badge.is-hidden{display:none}
.notif-dropdown{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:220;
  display:none;
  width:min(340px,calc(100vw - 32px));
  padding:12px;
  border:1px solid var(--border-glass);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.96));
  box-shadow:0 28px 90px rgba(12,31,63,.28);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.notif-menu.is-open .notif-dropdown{display:block;animation:modalIn 160ms ease both}
.notif-dropdown-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.notif-dropdown-head strong{color:var(--text);font-size:.94rem}
.notif-dropdown-head a{color:var(--primary);font-size:.8rem;font-weight:700}
.notif-preview-list{display:grid;gap:8px}
.notif-preview-item{
  display:grid;
  gap:2px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
}
.notif-preview-item.is-unread{border-color:var(--info-border);background:var(--primary-soft)}
.notif-preview-item span{color:var(--text);font-size:.86rem;font-weight:700}
.notif-preview-item small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted);line-height:1.35}
.empty-mini{padding:12px;color:var(--muted);font-size:.86rem;text-align:center}

.page-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.page-section-head h2{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 6px;
  font-size:1.35rem;
}
.page-section-head p{margin:0;color:var(--muted);font-size:.92rem}
.form-row-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.check-row{display:flex;align-items:center;gap:9px;color:var(--text-soft);font-size:.88rem;font-weight:600}
.check-row input{width:16px;height:16px;accent-color:var(--primary)}
.btn-mini{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:5px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary);
  background:var(--surface-glass);
  font-size:.75rem;
  font-weight:700;
}
.btn-mini:hover{background:var(--surface);border-color:var(--border-strong)}
.btn-mini.danger{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}

@keyframes modalIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal-overlay.is-open .modal-card{animation:modalIn 180ms ease both}
.modal-card-wide{width:min(900px,100%)}
.modal-split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(260px,1fr);gap:18px;align-items:start}
.event-manager-list{display:grid;gap:10px;max-height:540px;overflow:auto;padding-right:4px}
.event-manager-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px}
.event-manager-head strong{font-size:.95rem;color:var(--text)}
.event-manager-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:var(--radius-md);
  background:var(--surface);
}
.event-manager-item strong{display:block;color:var(--text);font-size:.88rem}
.event-manager-item small{display:block;margin-top:2px;color:var(--muted);line-height:1.35}
.event-manager-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.event-manager-actions form{display:inline-flex;margin:0}
.priority-low{border-left-color:var(--muted-soft) !important}
.priority-normal{border-left-color:var(--primary) !important}
.priority-high{border-left-color:var(--warning) !important}
.priority-urgent{border-left-color:var(--danger) !important}

.calendar-page-card,.announcements-page-card{display:grid;gap:16px}
.calendar-filters,.announcement-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.calendar-filters input,.calendar-filters select,.announcement-filters input,.announcement-filters select{min-height:40px;max-width:220px}
.calendar-page-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.calendar-view-tabs,.view-toggle{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface-glass)}
.calendar-view-tabs button,.view-toggle button{border:0;border-radius:var(--radius-pill);background:transparent;color:var(--muted);font-size:.78rem;font-weight:800;padding:7px 12px}
.calendar-view-tabs button.is-active,.view-toggle button.is-active{color:var(--surface);background:var(--primary);box-shadow:var(--shadow-xs)}
.calendar-page-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.calendar-page-nav strong{min-width:150px;text-align:center;color:var(--text)}
.full-calendar-layout{display:grid;gap:8px}
.full-calendar-weekdays,.full-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.full-calendar-weekdays span{color:var(--muted);font-size:.7rem;font-weight:800;text-align:center;text-transform:uppercase}
.full-calendar-day{
  min-height:118px;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.76);
  transition:border-color var(--transition),box-shadow var(--transition),background var(--transition);
}
.full-calendar-day.is-muted{background:rgba(245,249,254,.58);color:var(--muted-soft)}
.full-calendar-day.is-today{border-color:var(--info-border);box-shadow:inset 0 0 0 1px rgba(var(--primary-rgb),.12)}
.full-calendar-day.is-drop-target{border-color:var(--primary);background:var(--primary-soft)}
.full-calendar-date{font-size:.78rem;font-weight:800;color:var(--text)}
.full-calendar-events{display:grid;gap:5px}
.full-calendar-event{
  display:block;
  width:100%;
  padding:6px 7px;
  border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:10px;
  color:var(--text);
  background:var(--surface);
  text-align:left;
  font-size:.72rem;
  font-weight:700;
  line-height:1.25;
  cursor:pointer;
}
.full-calendar-event small{display:block;margin-top:2px;color:var(--muted);font-size:.65rem;font-weight:600}
.full-calendar-event[draggable="true"]{cursor:grab}
.calendar-mobile-list{display:none;gap:8px}
.calendar-list-item{padding:12px;border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius-md);background:var(--surface)}
.calendar-list-item strong{display:block;color:var(--text);font-size:.9rem}
.calendar-list-item span{display:block;color:var(--muted);font-size:.78rem;margin-top:2px}
.details-panel{display:grid;gap:10px;color:var(--text-soft);line-height:1.55}
.details-panel .detail-row{padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface)}

.skeleton-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.skeleton-grid span{height:72px;border-radius:var(--radius-md);background:linear-gradient(90deg,var(--surface-muted),var(--surface),var(--surface-muted));background-size:220% 100%;animation:skeleton 1.1s linear infinite}
.skeleton-grid.is-hidden{display:none}
@keyframes skeleton{to{background-position:-220% 0}}
.empty-state{
  display:grid;
  justify-items:center;
  gap:8px;
  padding:28px 20px;
  border:1px dashed var(--border-strong);
  border-radius:var(--radius-lg);
  background:var(--surface-glass);
  color:var(--muted);
  text-align:center;
}
.empty-state strong{color:var(--text);font-size:1rem}
.empty-state.compact{padding:18px}

.announcement-list{display:grid;gap:12px}
.announcement-list.is-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.announcement-card{
  display:grid;
  gap:9px;
  padding:16px;
  border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
}
.announcement-card-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.announcement-card h3{margin:0;color:var(--text);font-size:1rem}
.announcement-card p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;color:var(--text-soft);font-size:.9rem}
.announcement-meta{color:var(--muted);font-size:.78rem}
.announcement-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.announcement-actions form{display:inline-flex;margin:0}
.tag{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface-muted);color:var(--muted);font-size:.7rem;font-weight:800;text-transform:capitalize}
.tag-low{background:var(--surface-muted)}
.tag-normal{background:var(--primary-soft);color:var(--primary-deep);border-color:var(--info-border)}
.tag-high{background:var(--warning-bg);color:var(--warning);border-color:var(--warning-border)}
.tag-urgent{background:var(--danger-bg);color:var(--danger);border-color:var(--danger-border)}
.pagination{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-weight:700;font-size:.86rem}

@media (max-width:1024px){
  :root{--right-panel-width:280px}
  .modal-split{grid-template-columns:1fr}
  .announcement-list.is-grid{grid-template-columns:1fr}
}

@media (max-width:840px){
  .notif-dropdown{right:-68px}
  .page-section-head{flex-direction:column;align-items:stretch}
  .card-header-actions{justify-content:flex-start}
  .calendar-filters input,.calendar-filters select,.announcement-filters input,.announcement-filters select{max-width:none;width:100%}
  .full-calendar-weekdays,.full-calendar-grid{display:none}
  .calendar-mobile-list{display:grid}
  .modal-overlay{padding:0;align-items:stretch;justify-content:stretch}
  .modal-card{width:100%;max-height:none;height:100%;border-radius:0;overflow:auto}
  .modal-card-wide{width:100%}
}

@media (max-width:640px){
  .form-row-2{grid-template-columns:1fr}
  .calendar-page-toolbar{align-items:stretch}
  .calendar-view-tabs,.view-toggle,.calendar-page-nav{width:100%;justify-content:center}
  .skeleton-grid{grid-template-columns:1fr}
}

@media (max-width:767px){
  .msf-page{padding:0 0 24px}
  .msf-frame{border-radius:20px}
  .msf-intro{min-height:300px;padding:34px 22px}
  .msf-question-grid,.msf-option-grid{grid-template-columns:1fr}
  .msf-section{padding:20px 16px 24px}
  .msf-section-nav{padding:14px 14px 0}
  .msf-intro-actions,.msf-actions{padding:16px;flex-direction:column;align-items:stretch}
  .msf-actions-left,.msf-actions-right{width:100%;flex-direction:column;align-items:stretch}
  .msf-likert-wrap{border-radius:16px}
  .msf-likert-table{min-width:680px}
  .guidance-modal-overlay{padding:0;align-items:stretch}
  .guidance-modal{width:100%;min-height:100vh;border-radius:0;align-content:center;padding:28px}
}


/* Microsoft Forms inspired form redesign */
.msf-page{
  width:100%;
  padding:clamp(10px,2vw,22px) 0 38px;
}

.msf-frame{
  width:min(100%,1160px);
  margin:0 auto;
  overflow:hidden;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:28px;
  background:rgba(255,255,255,.88);
  box-shadow:0 24px 70px rgba(37,79,145,.12);
}

.msf-frame:not(.is-started) .msf-progress{
  display:none;
}

.msf-progress{
  height:7px;
  background:#e7f0fc;
}

.msf-progress-bar{
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--primary-deep),var(--primary),var(--sky));
  transition:width 240ms ease;
}

.msf-intro-section.is-active,
.msf-section.is-active{
  display:block;
  animation:msfFadeUp 260ms ease both;
}

.msf-intro-hero{
  width:100%;
  min-height:clamp(470px,68vh,650px);
  display:grid;
  place-items:center;
  padding:clamp(34px,7vw,76px) clamp(18px,5vw,56px);
  background:
    radial-gradient(circle at 14% 16%,rgba(255,255,255,.58),transparent 30%),
    radial-gradient(circle at 88% 6%,rgba(143,197,246,.34),transparent 34%),
    linear-gradient(135deg,#f7fbff 0%,#eaf3ff 44%,#dcecff 100%);
}

.msf-intro{
  width:min(100%,900px);
  min-height:auto;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:transparent;
  color:var(--text);
}

.msf-intro-icon{
  width:78px;
  height:78px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:999px;
  color:var(--primary-deep);
  background:rgba(255,255,255,.76);
  box-shadow:0 18px 44px rgba(37,79,145,.12), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.msf-chip{
  margin:0 0 18px;
  padding:8px 14px;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:rgba(255,255,255,.66);
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.msf-intro h2{
  max-width:840px;
  margin:0;
  color:var(--text);
  font-size:clamp(2rem,4.4vw,3.35rem);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.055em;
  text-align:center;
}

.msf-intro p{
  max-width:760px;
  margin:18px auto 0;
  color:var(--text-soft);
  font-size:clamp(.98rem,1.3vw,1.08rem);
  line-height:1.75;
  text-align:center;
}

.msf-meta{
  width:min(100%,760px);
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
  margin:28px auto 0;
}

.msf-meta-item,
.msf-meta span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:38px;
  padding:9px 14px;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:rgba(255,255,255,.78);
  font-size:.84rem;
  font-weight:700;
  box-shadow:0 8px 22px rgba(37,79,145,.06);
}

.msf-meta-svg{
  flex-shrink:0;
  opacity:.9;
}

.msf-intro-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  width:100%;
  margin-top:34px;
  padding:0;
  border-top:0;
  background:transparent;
}

.msf-begin{
  min-width:176px;
  min-height:50px;
  padding:13px 28px;
  border-radius:16px;
  font-size:.98rem;
  letter-spacing:.01em;
  transition:background 200ms ease,border-color 200ms ease,box-shadow 200ms ease,color 200ms ease,transform 200ms ease;
}

.msf-begin:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(var(--primary-strong-rgb),.26);
}

.msf-questions-wrap.is-active{
  display:block;
  padding-bottom:8px;
  background:linear-gradient(180deg,#fbfdff 0%,#f7fbff 100%);
}

.msf-section-nav{
  position:sticky;
  top:0;
  z-index:18;
  display:flex;
  gap:10px;
  padding:18px clamp(16px,3vw,28px) 12px;
  overflow-x:auto;
  border-bottom:1px solid rgba(var(--primary-rgb),.10);
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  scrollbar-width:thin;
}

body.form-focus .msf-section-nav{
  top:0;
}

body.form-focus .topbar.template-topbar{
  display:flex;
}

.msf-section-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  min-height:38px;
  padding:8px 13px;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:var(--radius-pill);
  color:var(--text-soft);
  background:rgba(255,255,255,.86);
  font:inherit;
  font-size:.82rem;
  font-weight:800;
  cursor:pointer;
  transition:background 200ms ease,border-color 200ms ease,color 200ms ease,box-shadow 200ms ease,transform 200ms ease;
}

.msf-section-pill:hover{
  transform:translateY(-1px);
}

.msf-section-pill span{
  width:23px;
  height:23px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:var(--primary-soft);
  color:var(--primary);
  font-size:.74rem;
}

.msf-section-pill.is-active{
  color:var(--primary-deep);
  border-color:rgba(var(--primary-rgb),.28);
  background:var(--primary-soft);
  box-shadow:var(--shadow-xs);
}

.msf-section-pill.is-complete span{
  color:#fff;
  background:var(--primary);
}

.msf-section{
  max-width:840px;
  margin:0 auto;
  padding:34px clamp(18px,4vw,34px) 44px;
  background:transparent;
}

.msf-section-head{
  margin-bottom:24px;
  padding:0 0 20px;
  border-bottom:1px solid rgba(var(--primary-rgb),.11);
}

.msf-section-head h3{
  margin:0 0 8px;
  color:var(--text);
  font-size:clamp(1.28rem,2vw,1.6rem);
  font-weight:800;
  letter-spacing:-.035em;
}

.msf-section-head p{
  max-width:720px;
  margin:0;
  color:var(--text-soft);
  line-height:1.65;
}

.msf-question-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:22px;
}

.msf-question{
  display:grid;
  gap:12px;
  width:100%;
  padding:24px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:20px;
  background:rgba(255,255,255,.96);
  box-shadow:0 12px 34px rgba(39,68,112,.07);
  scroll-margin-top:112px;
  transition:border-color 200ms ease,box-shadow 200ms ease,transform 200ms ease,background 200ms ease;
}

.msf-question:hover,
.msf-question:focus-within{
  border-color:rgba(var(--primary-rgb),.30);
  box-shadow:0 18px 44px rgba(39,68,112,.10);
}

.msf-question.full{
  grid-column:1;
}

.msf-question.has-error,
.msf-likert-table tr.has-error{
  border-color:rgba(191,63,74,.45);
  background:#fff8f9;
}

.msf-question-label{
  display:flex;
  align-items:flex-start;
  gap:5px;
  margin:0;
  color:var(--text);
  font-weight:800;
  line-height:1.35;
}

.msf-required{
  color:var(--danger);
}

.msf-input,
select.msf-input,
textarea.msf-input{
  width:100%;
  min-height:48px;
  padding:13px 14px;
  border:1px solid var(--border-strong);
  border-radius:14px;
  color:var(--text);
  background:#fff;
  font:inherit;
  outline:0;
  transition:border-color 200ms ease,box-shadow 200ms ease,background 200ms ease;
}

textarea.msf-input{
  min-height:130px;
  resize:vertical;
}

.msf-input::placeholder{
  color:var(--muted-soft);
}

.msf-input:focus,
select.msf-input:focus,
textarea.msf-input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(var(--primary-rgb),.13);
  background:#fff;
}

.msf-question.is-prefilled .msf-input{
  border:1px solid rgba(var(--primary-rgb),.18);
  border-radius:14px;
  background:#f7fbff;
}

.msf-note{
  border-style:dashed;
  background:linear-gradient(135deg,rgba(var(--primary-rgb),.07),rgba(255,255,255,.96));
}

.msf-option-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.msf-option-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:50px;
  padding:13px 15px;
  border:1px solid var(--border);
  border-radius:15px;
  color:var(--text);
  background:#fff;
  cursor:pointer;
  transition:background 200ms ease,border-color 200ms ease,box-shadow 200ms ease,transform 200ms ease;
}

.msf-option-card:hover,
.msf-option-card.is-selected{
  border-color:rgba(var(--primary-rgb),.52);
  background:#f3f8ff;
  box-shadow:var(--shadow-xs);
}

.msf-option-card input{
  flex-shrink:0;
  width:18px;
  height:18px;
  accent-color:var(--primary);
}

.msf-checkbox-card input{
  border-radius:4px;
}

.msf-rating{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.msf-rating-item span{
  width:46px;
  height:46px;
  border:1px solid var(--border);
  border-radius:14px;
  color:var(--muted);
  background:#fff;
}

.msf-rating-item input:checked + span,
.msf-rating-item span:hover{
  color:#fff;
  border-color:var(--primary);
  background:var(--primary);
  box-shadow:var(--shadow-xs);
  transform:translateY(-1px);
}

.msf-likert-wrap{
  width:100%;
  overflow-x:auto;
  border:1px solid var(--border);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 26px rgba(39,68,112,.05);
}

.msf-upload{
  min-height:142px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:20px;
  border:2px dashed rgba(var(--primary-rgb),.28);
  border-radius:18px;
  background:#f7fbff;
  text-align:center;
  cursor:pointer;
}

.msf-upload-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  color:#fff;
  background:var(--primary);
  box-shadow:0 12px 24px rgba(var(--primary-strong-rgb),.18);
}

.msf-actions{
  position:sticky;
  bottom:0;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px clamp(16px,3vw,26px);
  border-top:1px solid rgba(var(--primary-rgb),.12);
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.msf-actions.is-hidden,
.msf-questions-wrap{
  display:none;
}

.msf-actions-left,
.msf-actions-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.msf-progress-text{
  color:var(--primary-deep);
  font-size:.9rem;
  font-weight:800;
}

.msf-autosave-status{
  color:var(--muted);
  font-size:.8rem;
  font-weight:700;
}

.msf-submit.is-hidden,
.msf-prev.is-hidden{
  display:none;
}

.msf-save-draft.is-saved{
  border-color:rgba(var(--primary-rgb),.4);
  color:var(--primary);
  background:var(--primary-soft);
}

.msf-submit.is-loading{
  pointer-events:none;
  opacity:.82;
}

.msf-state-card{
  display:grid;
  justify-items:center;
  gap:14px;
  padding:48px clamp(22px,5vw,42px);
  text-align:center;
}

.msf-state-icon,
.guidance-modal-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:62px;
  height:62px;
  border-radius:999px;
  color:#fff;
  background:var(--primary);
  box-shadow:0 16px 30px rgba(var(--primary-rgb),.25);
}

@media (max-width:767px){
  .msf-page{
    padding:0 0 24px;
  }

  .msf-frame{
    width:100%;
    border-radius:20px;
  }

  .msf-intro-hero{
    min-height:calc(100vh - 130px);
    padding:34px 18px;
  }

  .msf-intro-icon{
    width:66px;
    height:66px;
    margin-bottom:16px;
  }

  .msf-intro h2{
    font-size:clamp(1.75rem,9vw,2.35rem);
  }

  .msf-intro p{
    font-size:.95rem;
  }

  .msf-meta{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
    gap:10px;
  }

  .msf-meta-item,
  .msf-meta span{
    width:100%;
  }

  .msf-begin{
    width:100%;
    max-width:280px;
  }

  .msf-section-nav{
    padding:14px 14px 10px;
  }

  .msf-section{
    padding:24px 16px 32px;
  }

  .msf-question{
    padding:20px;
    border-radius:18px;
  }

  .msf-actions{
    flex-direction:column;
    align-items:stretch;
    padding:14px;
  }

  .msf-actions-left,
  .msf-actions-right{
    width:100%;
    flex-direction:column;
    align-items:stretch;
  }

  .msf-actions-left .msf-progress-text,
  .msf-actions-left .msf-autosave-status{
    text-align:center;
  }

  .msf-likert-wrap{
    border-radius:16px;
  }

  .msf-likert-table{
    min-width:680px;
  }
}

@media (prefers-reduced-motion:reduce){
  .msf-intro-section.is-active,
  .msf-section.is-active,
  .msf-begin,
  .msf-question,
  .msf-option-card,
  .msf-section-pill{
    animation:none;
    transition:none;
  }
}

/* Guidance Associate Form Management */
.page-intro{
  margin:0 0 18px;
  padding:22px 24px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(234,243,255,.88));
  box-shadow:var(--shadow-xs);
}
.page-kicker,
.fm-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:8px;
  color:var(--primary);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.page-intro h2,
.fm-panel-head h2,
.fm-preview-head h2{margin:0 0 6px;font-size:clamp(1.35rem, 2vw, 2rem)}
.page-intro p,
.fm-panel-head p,
.fm-preview-head p{margin:0;color:var(--muted);max-width:760px}
.fm-panel{
  display:grid;
  gap:18px;
  margin-bottom:24px;
}
.fm-panel-head,
.fm-preview-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px;
  border-radius:var(--radius-xl);
  border:1px solid rgba(255,255,255,.74);
  background:linear-gradient(135deg, rgba(var(--primary-rgb),.13), rgba(255,255,255,.94) 55%, rgba(220,236,255,.9));
  box-shadow:var(--shadow-sm);
}
.fm-head-actions,
.fm-actions-row,
.fm-status-actions,
.fm-list-actions,
.fm-modal-actions,
.fm-card-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.fm-head-actions .btn,
.fm-status-actions .btn,
.fm-card-toolbar .btn{display:inline-flex;align-items:center;gap:8px}
.fm-grid{display:grid;gap:18px}
.fm-overview-grid{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr)}
.fm-main-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.95fr)}
.fm-footer-grid{grid-template-columns:minmax(0,.8fr) minmax(320px,1.2fr)}
.fm-card{
  padding:20px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.94);
  box-shadow:var(--shadow-xs);
}
.fm-card-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
  color:var(--text);
}
.fm-card-title span:first-child{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:12px;
  color:var(--primary);
  background:var(--primary-soft);
}
.fm-overview-card h3{margin:0 0 8px;font-size:1.2rem}
.fm-overview-card p{margin:0 0 16px;color:var(--muted)}
.fm-overview-list,
.fm-stat-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.fm-overview-list span,
.fm-stat-grid span{
  display:grid;
  gap:2px;
  min-width:0;
  padding:12px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface-soft);
}
.fm-overview-list strong,
.fm-stat-grid strong{font-size:.95rem;color:var(--text);word-break:break-word}
.fm-overview-list small,
.fm-stat-grid small{font-size:.76rem;color:var(--muted)}
.fm-status-row{margin-top:14px}
.fm-badge,
.fm-chip{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  border:1px solid var(--border);
  background:var(--surface-soft);
}
.fm-badge-success{color:var(--success);background:var(--success-bg);border-color:var(--success-border)}
.fm-badge-warning{color:var(--warning);background:var(--warning-bg);border-color:var(--warning-border)}
.fm-badge-danger{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}
.fm-chip{margin:0 6px 6px 0;color:var(--primary);background:var(--primary-soft)}
.fm-chip.muted{color:var(--muted);background:var(--surface-muted)}
.fm-inline-form,
.fm-settings-form{
  display:grid;
  gap:12px;
}
.fm-inline-form{grid-template-columns:1fr 170px auto auto;margin:16px 0}
.fm-settings-form label,
.fm-modal label{
  display:grid;
  gap:7px;
  color:var(--text-soft);
  font-size:.88rem;
  font-weight:600;
}
.fm-settings-form input,
.fm-settings-form select,
.fm-settings-form textarea,
.fm-inline-form input,
.fm-inline-form select,
.fm-modal input,
.fm-modal select,
.fm-modal textarea{
  width:100%;
  min-height:44px;
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px 12px;
  color:var(--text);
  background:rgba(255,255,255,.94);
  outline:none;
  transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
}
.fm-settings-form textarea,
.fm-modal textarea{resize:vertical;min-height:92px}
.fm-settings-form input:focus,
.fm-settings-form select:focus,
.fm-settings-form textarea:focus,
.fm-inline-form input:focus,
.fm-inline-form select:focus,
.fm-modal input:focus,
.fm-modal select:focus,
.fm-modal textarea:focus{
  border-color:rgba(var(--primary-rgb),.58);
  box-shadow:var(--focus-ring);
  background:#fff;
}
.fm-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fm-toggle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.fm-check{
  display:flex !important;
  grid-template-columns:none !important;
  align-items:center;
  gap:10px !important;
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface-soft);
  color:var(--text) !important;
  cursor:pointer;
}
.fm-check input{width:18px !important;min-height:auto !important;height:18px;padding:0;accent-color:var(--primary)}
.fm-status-actions{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.btn.danger,
.btn-primary.danger{border-color:var(--danger-border);color:var(--danger)}
.btn-primary.danger{background:var(--danger);color:#fff}
.fm-full{width:100%;justify-content:center;margin-bottom:12px}
.fm-list,
.fm-question-list,
.fm-recent-list,
.fm-activity-list{display:grid;gap:10px}
.fm-list-item,
.fm-question-item,
.fm-recent-list div,
.fm-activity-list div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface-soft);
}
.fm-list-item > div:first-child,
.fm-question-item > div:first-child{display:grid;gap:3px;min-width:0}
.fm-list-item strong,
.fm-question-item strong{color:var(--text)}
.fm-list-item small,
.fm-question-item small,
.fm-question-item span,
.fm-recent-list small,
.fm-activity-list small{color:var(--muted);font-size:.8rem}
.fm-list-actions{justify-content:flex-end;flex-shrink:0}
.btn-sm{min-height:34px;padding:7px 10px;font-size:.82rem}
.fm-questions-card{margin-bottom:18px}
.fm-card-toolbar{justify-content:space-between;margin-bottom:14px}
.fm-card-toolbar p{margin:0;color:var(--muted)}
.fm-empty{margin:0;color:var(--muted)}
.fm-modal{
  position:fixed;
  inset:0;
  display:none;
  place-items:center;
  padding:22px;
  background:rgba(12,24,45,.36);
  backdrop-filter:blur(10px);
  z-index:2000;
}
.fm-modal.is-open{display:grid}
.fm-modal-card{
  width:min(620px,100%);
  max-height:90vh;
  overflow:auto;
  padding:20px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:22px;
  background:rgba(255,255,255,.96);
  box-shadow:var(--shadow-lg);
}
.fm-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.fm-modal-head h3{margin:0}
.fm-modal-head button{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-soft);
  color:var(--text);
}
.fm-modal form{display:grid;gap:12px}
.fm-modal-actions{justify-content:flex-end;margin-top:4px}
.fm-confirm-card p{margin:0 0 14px;color:var(--text-soft)}
.fm-preview{margin-bottom:24px}
.fm-preview .msf-page{padding:0;background:transparent}
.fm-preview .msf-frame{margin:0 auto}

@media (max-width:1100px){
  .fm-overview-grid,
  .fm-main-grid,
  .fm-footer-grid{grid-template-columns:1fr}
  .fm-inline-form{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .page-intro,
  .fm-panel-head,
  .fm-preview-head,
  .fm-card{padding:16px;border-radius:18px}
  .fm-panel-head,
  .fm-preview-head,
  .fm-card-toolbar{align-items:stretch;flex-direction:column}
  .fm-head-actions,
  .fm-head-actions .btn,
  .fm-card-toolbar .btn,
  .fm-actions-row .btn,
  .fm-status-actions .btn,
  .fm-status-actions form{width:100%}
  .fm-overview-list,
  .fm-stat-grid,
  .fm-toggle-grid,
  .fm-two-col,
  .fm-inline-form{grid-template-columns:1fr}
  .fm-list-item,
  .fm-question-item{display:grid}
  .fm-list-actions{justify-content:stretch}
  .fm-list-actions form,
  .fm-list-actions .btn{flex:1;min-width:calc(50% - 6px)}
  .fm-modal{padding:12px}
}

/* --- Microsoft Forms style Guidance Associate builder --- */
.mff-shell{
  margin:0 0 24px;
}
.mff-topbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  padding:14px 18px;
  border:1px solid #d8d8d8;
  border-radius:18px 18px 0 0;
  background:#f7f7f8;
}
.mff-brand,
.mff-titleline,
.mff-actions,
.mff-action-link,
.mff-btn,
.mff-side-pill,
.mff-section-title,
.mff-quick-card,
.mff-card-actions,
.mff-bottom-card-head,
.mff-search-row,
.mff-choice-row,
.mff-settings-actions,
.mff-drawer-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.mff-brand{font-weight:700;color:#1f1f1f}
.mff-brand-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:9px;
  color:#136c74;
  background:#fff;
  border:1px solid #d9d9d9;
}
.mff-titlebar{text-align:center}
.mff-titleline{justify-content:center;gap:8px;font-size:1.05rem;color:#1f1f1f}
.mff-titleline strong{font-weight:700}
.mff-titlebar small{display:block;margin-top:2px;color:#6b6b6b;font-size:.8rem}
.mff-divider{color:#9a9a9a}
.mff-actions{justify-content:flex-end;flex-wrap:wrap}
.mff-action-link,
.mff-btn,
.mff-mini-btn,
.mff-add-link,
.mff-text-link{
  border:0;
  background:transparent;
  color:#1f1f1f;
  text-decoration:none;
  font:inherit;
  cursor:pointer;
}
.mff-action-link{
  min-height:38px;
  padding:8px 10px;
  border-radius:999px;
}
.mff-action-link:hover{background:#eceeef}
.mff-btn{
  justify-content:center;
  min-height:40px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid #0f6cbd;
  font-weight:700;
}
.mff-btn-primary{color:#fff;background:#0f7b82;border-color:#0f7b82}
.mff-btn-primary:hover{background:#0d6d73;border-color:#0d6d73}
.mff-btn-outline{color:#0f7b82;background:#fff;border-color:#0f7b82}
.mff-inline-action{display:inline-block;margin:0}
.mff-stage{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  gap:24px;
  padding:28px 22px 24px;
  border:1px solid #d8d8d8;
  border-top:0;
  border-radius:0 0 18px 18px;
  background:linear-gradient(180deg,#dff2ef 0%, #d3e9ea 30%, #cee1f3 100%);
}
.mff-side-pill{
  position:absolute;
  left:18px;
  top:140px;
  z-index:2;
  flex-direction:column;
  justify-content:center;
  width:78px;
  min-height:120px;
  padding:12px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid #dfdfdf;
  color:#3d3d3d;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  text-align:center;
  font-size:.8rem;
}
.mff-side-pill-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:8px;
  color:#136c74;
}
.mff-canvas-wrap{padding-left:66px}
.mff-canvas-surface{
  max-width:1040px;
  margin:0 auto;
  padding:42px 0 0;
  border-radius:22px;
  background:#fafafa;
  box-shadow:0 10px 26px rgba(0,0,0,.08);
}
.mff-title-card,
.mff-quickstart,
.mff-builder-card,
.mff-bottom-card{
  width:min(100%, 920px);
  margin:0 auto 22px;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:18px;
}
.mff-title-card{padding:24px}
.mff-title-form{display:grid;gap:18px}
.mff-title-input-wrap{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
  padding:0 0 14px;
  border-bottom:1px solid #ececec;
}
.mff-title-input,
.mff-description-input,
.mff-field input,
.mff-field textarea,
.mff-field select{
  width:100%;
  border:1px solid transparent;
  border-radius:8px;
  background:#fff;
  color:#1f1f1f;
  font:inherit;
  outline:none;
}
.mff-title-input{
  min-height:52px;
  padding:0;
  font-size:2rem;
  font-weight:700;
}
.mff-description-input{
  min-height:48px;
  padding:0;
  resize:vertical;
  color:#666;
  font-size:1rem;
}
.mff-title-input:focus,
.mff-description-input:focus,
.mff-field input:focus,
.mff-field textarea:focus,
.mff-field select:focus{
  border-color:#0f7b82;
  box-shadow:0 0 0 3px rgba(15,123,130,.12);
}
.mff-icon-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border:1px solid #dfdfdf;
  border-radius:10px;
  background:#fff;
  color:#555;
  cursor:pointer;
}
.mff-quickstart{padding:24px}
.mff-section-heading{display:grid;gap:4px;margin-bottom:16px}
.mff-section-title h3{margin:0;color:#0c6970;font-size:1.9rem}
.mff-heading-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:#0c8a90;
  color:#fff;
  font-weight:700;
}
.mff-section-heading p{margin:0;color:#6b6b6b}
.mff-quickstart-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.mff-quick-card{
  justify-content:flex-start;
  min-height:66px;
  padding:18px 20px;
  border:1px solid #48a3ab;
  border-radius:13px;
  background:#fff;
  color:#1f1f1f;
  font-size:1.02rem;
}
.mff-quick-card:hover{background:#f5fbfb}
.mff-quick-icon{color:#0f7b82}
.mff-overview-strip{
  width:min(100%, 920px);
  margin:0 auto 22px;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
}
.mff-stat-chip{
  display:grid;
  gap:5px;
  align-content:start;
  padding:14px 16px;
  border:1px solid #e2e2e2;
  border-radius:14px;
  background:#fff;
}
.mff-stat-chip strong{font-size:.95rem;color:#1f1f1f}
.mff-stat-chip span{color:#666;font-size:.8rem}
.mff-builder-stack{display:grid;gap:18px}
.mff-builder-card{
  padding:22px;
  border-top:6px solid #0f7b82;
}
.mff-empty-builder{border-top-color:#b9c8cc}
.mff-builder-card-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}
.mff-builder-card-head small,
.mff-question-copy small,
.mff-status-note{display:block;color:#6a6a6a;font-size:.82rem}
.mff-builder-card-head h4,
.mff-bottom-card-head h4{margin:2px 0 6px;color:#1f1f1f;font-size:1.2rem}
.mff-builder-card-head p{margin:0;color:#666;max-width:620px}
.mff-card-actions{flex-wrap:wrap;justify-content:flex-end}
.mff-mini-btn,
.mff-add-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:0 14px;
  border:1px solid #d7d7d7;
  border-radius:999px;
  background:#fff;
  color:#1f1f1f;
}
.mff-mini-btn:hover,
.mff-add-link:hover{background:#f4f5f6}
.mff-mini-btn.is-danger{color:#b42318;border-color:#efc1bc;background:#fff5f4}
.mff-question-stack{display:grid;gap:12px}
.mff-question-card{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border:1px solid #e9e9e9;
  border-radius:14px;
  background:#fbfbfb;
}
.mff-question-copy{display:grid;gap:4px}
.mff-question-copy strong{color:#1f1f1f}
.mff-builder-card-footer{
  display:flex;
  justify-content:flex-end;
  margin-top:16px;
}
.mff-empty-state,
.mff-empty-copy{color:#666}
.mff-bottom-grid{
  width:min(100%, 920px);
  margin:0 auto 0;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  padding-bottom:26px;
}
.mff-bottom-card{padding:20px}
.mff-bottom-card-head{justify-content:space-between;margin-bottom:14px}
.mff-text-link{color:#0f7b82;font-weight:700}
.mff-response-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}
.mff-response-grid div,
.mff-recent-stack div{
  padding:12px 14px;
  border:1px solid #e4e4e4;
  border-radius:14px;
  background:#fcfcfc;
}
.mff-response-grid strong{display:block;color:#1f1f1f;font-size:1.1rem}
.mff-response-grid span,
.mff-recent-stack small{display:block;color:#666;font-size:.8rem}
.mff-search-row{flex-wrap:wrap;margin-bottom:14px}
.mff-search-row input,
.mff-search-row select{
  min-height:38px;
  padding:0 12px;
  border:1px solid #d8d8d8;
  border-radius:999px;
  background:#fff;
  color:#1f1f1f;
  font:inherit;
}
.mff-search-row input{flex:1 1 220px}
.mff-search-row select{flex:0 0 180px}
.mff-recent-stack{display:grid;gap:10px}
.mff-recent-stack strong{display:block;color:#1f1f1f}
.mff-settings-drawer{
  position:sticky;
  top:100px;
  align-self:start;
  padding:16px;
  border:1px solid #dedede;
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,.08);
  max-height:78vh;
  overflow:auto;
}
.mff-settings-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}
.mff-settings-head h3{margin:0;font-size:1.85rem;color:#1f1f1f}
.mff-settings-group,
.mff-settings-panel{
  display:grid;
  gap:12px;
}
.mff-settings-group{
  margin-bottom:14px;
  padding:16px;
  border:1px solid #ececec;
  border-radius:14px;
  background:#fafafa;
}
.mff-settings-group h4{margin:0 0 2px;color:#1f1f1f;font-size:1.1rem}
.mff-choice-row{
  align-items:flex-start;
  padding:6px 0;
}
.mff-choice-row input{margin-top:4px;accent-color:#0f7b82}
.mff-choice-row span{display:grid;gap:2px}
.mff-choice-row strong{color:#1f1f1f}
.mff-choice-row small{color:#666;line-height:1.45}
.mff-field{display:grid;gap:6px;color:#444;font-size:.9rem;font-weight:600}
.mff-field input,
.mff-field textarea,
.mff-field select{
  min-height:42px;
  padding:10px 12px;
  border:1px solid #d9d9d9;
  border-radius:12px;
}
.mff-field textarea{min-height:92px;resize:vertical}
.mff-settings-actions{justify-content:flex-end;flex-wrap:wrap}
.mff-drawer-actions{display:grid;gap:10px}
.mff-full-btn{width:100%}

@media (max-width:1400px){
  .mff-stage{grid-template-columns:minmax(0,1fr) 360px}
  .mff-overview-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1180px){
  .mff-stage{grid-template-columns:1fr}
  .mff-settings-drawer{display:none;position:fixed;right:18px;top:92px;z-index:60;width:min(380px,calc(100vw - 36px));max-height:calc(100vh - 110px)}
  .mff-shell.is-settings-open .mff-settings-drawer{display:block}
}
@media (max-width:960px){
  .mff-topbar{grid-template-columns:1fr;justify-items:center;text-align:center}
  .mff-actions{justify-content:center}
  .mff-canvas-wrap{padding-left:0}
  .mff-side-pill{position:static;margin:0 auto 16px}
  .mff-stage{padding:20px 14px}
  .mff-title-card,
  .mff-quickstart,
  .mff-builder-card,
  .mff-bottom-card,
  .mff-overview-strip,
  .mff-bottom-grid{width:100%}
  .mff-quickstart-grid,
  .mff-overview-strip,
  .mff-bottom-grid,
  .mff-response-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .mff-topbar{padding:14px}
  .mff-actions,
  .mff-search-row,
  .mff-card-actions,
  .mff-builder-card-head,
  .mff-bottom-card-head,
  .mff-settings-actions{align-items:stretch;flex-direction:column}
  .mff-btn,
  .mff-action-link,
  .mff-mini-btn,
  .mff-add-link,
  .mff-search-row input,
  .mff-search-row select{width:100%}
  .mff-canvas-surface{padding-top:22px;border-radius:18px}
  .mff-title-input{font-size:1.65rem}
  .mff-quickstart-grid,
  .mff-overview-strip,
  .mff-bottom-grid,
  .mff-response-grid{grid-template-columns:1fr}
  .mff-question-card{flex-direction:column}
}

/* --- Flow update: responses first, closed settings, inline Microsoft Forms editor --- */
.mff-response-first-card{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  margin:0 0 18px;
  padding:20px 22px;
  border:1px solid #dde6ea;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
}
.mff-eyebrow{
  display:block;
  margin-bottom:6px;
  color:#0f7b82;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.mff-response-first-card h3{margin:0 0 6px;color:#1f1f1f;font-size:1.25rem}
.mff-response-first-card p{margin:0;color:#666;max-width:760px;line-height:1.55}
.mff-response-stats-inline{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}
.mff-response-stats-inline span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  padding:0 11px;
  border:1px solid #e2e2e2;
  border-radius:999px;
  color:#666;
  background:#fafafa;
  font-size:.86rem;
}
.mff-response-stats-inline strong{color:#1f1f1f}
.mff-response-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.mff-editor[hidden],
.mff-settings-drawer[hidden]{display:none!important}
.mff-editor.is-open{display:block}
.mff-stage{
  grid-template-columns:minmax(0,1fr);
}
.mff-shell.is-settings-open .mff-stage{grid-template-columns:minmax(0,1fr) 420px}
.mff-shell.is-settings-open .mff-settings-drawer{display:block!important}
.mff-form-meta-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:16px;
}
.mff-save-pill,
.mff-banner-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 10px;
  border:1px solid #dfdfdf;
  border-radius:999px;
  color:#555;
  background:#fafafa;
  font-size:.82rem;
  font-weight:700;
}
.mff-banner-btn{gap:7px;cursor:pointer;font:inherit}
.mff-banner-btn:hover{background:#f1f7f8;border-color:#a5d3d7;color:#0f7b82}
.mff-section-inline-form{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
  flex:1 1 560px;
}
.mff-section-edit-fields{
  display:grid;
  gap:8px;
  min-width:0;
  flex:1;
}
.mff-section-title-input,
.mff-section-description-input,
.mff-inline-field input,
.mff-inline-field textarea,
.mff-inline-field select{
  width:100%;
  border:1px solid #dddddd;
  border-radius:12px;
  background:#fff;
  color:#1f1f1f;
  font:inherit;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.mff-section-title-input{
  min-height:42px;
  padding:8px 12px;
  font-weight:800;
  font-size:1.15rem;
}
.mff-section-description-input{min-height:70px;padding:10px 12px;resize:vertical;color:#555}
.mff-inline-field{
  display:grid;
  gap:7px;
  color:#555;
  font-size:.88rem;
  font-weight:700;
}
.mff-inline-field input,
.mff-inline-field textarea,
.mff-inline-field select{min-height:42px;padding:10px 12px}
.mff-inline-field textarea{resize:vertical;min-height:74px}
.mff-section-title-input:focus,
.mff-section-description-input:focus,
.mff-inline-field input:focus,
.mff-inline-field textarea:focus,
.mff-inline-field select:focus{
  border-color:#0f7b82;
  box-shadow:0 0 0 3px rgba(15,123,130,.14);
}
.mff-question-card{
  display:grid;
  gap:14px;
  border:1px solid #e6e6e6;
  background:#fff;
}
.mff-question-card:focus-within,
.mff-question-card.is-active{
  border-color:#0f7b82;
  box-shadow:0 0 0 3px rgba(15,123,130,.13), 0 12px 28px rgba(0,0,0,.08);
}
.mff-question-inline-form{display:grid;gap:12px;width:100%}
.mff-question-grid-edit,
.mff-question-options-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 220px;
  gap:12px;
  align-items:start;
}
.mff-question-options-row{grid-template-columns:minmax(0,1fr) 190px}
.mff-grow{min-width:0}
.mff-option-tools{display:grid;gap:8px;align-content:start;padding-top:24px}
.mff-option-tools small{color:#777;line-height:1.4}
.mff-question-toolbar,
.mff-question-card-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.mff-question-card-actions{padding-top:12px;border-top:1px solid #eeeeee;justify-content:flex-end}
.mff-required-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:36px;
  padding:0 10px;
  border:1px solid #e0e0e0;
  border-radius:999px;
  background:#fafafa;
  color:#333;
  font-weight:700;
}
.mff-required-toggle input{accent-color:#0f7b82}
.mff-add-new-menu{
  position:relative;
  display:flex;
  justify-content:center;
  margin:12px 0;
}
.mff-add-new-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 16px;
  border:1px solid #0f7b82;
  border-radius:999px;
  color:#0f7b82;
  background:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.mff-add-new-popover{
  position:absolute;
  top:46px;
  z-index:20;
  display:none;
  grid-template-columns:repeat(3,minmax(130px,1fr));
  gap:8px;
  width:min(560px,90vw);
  padding:12px;
  border:1px solid #dfe6e8;
  border-radius:16px;
  background:#fff;
  box-shadow:0 18px 42px rgba(0,0,0,.12);
}
.mff-add-new-menu.is-open .mff-add-new-popover{display:grid}
.mff-add-new-popover button{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 12px;
  border:1px solid #e2e2e2;
  border-radius:12px;
  background:#fafafa;
  color:#1f1f1f;
  font:inherit;
  cursor:pointer;
}
.mff-add-new-popover button:hover{background:#eef8f8;border-color:#7ec3c8;color:#0f7b82}
.mff-quickstart[hidden]{display:none!important}
@media (max-width:1180px){
  .mff-shell.is-settings-open .mff-stage{grid-template-columns:1fr}
  .mff-shell.is-settings-open .mff-settings-drawer{position:fixed;right:18px;top:92px;z-index:60;width:min(380px,calc(100vw - 36px));max-height:calc(100vh - 110px)}
}
@media (max-width:760px){
  .mff-response-first-card,
  .mff-response-actions,
  .mff-section-inline-form,
  .mff-question-toolbar,
  .mff-question-card-actions{align-items:stretch;flex-direction:column}
  .mff-response-actions .mff-btn,
  .mff-section-inline-form .mff-mini-btn,
  .mff-question-toolbar .mff-mini-btn,
  .mff-question-card-actions .mff-mini-btn,
  .mff-question-card-actions form{width:100%}
  .mff-question-grid-edit,
  .mff-question-options-row,
  .mff-add-new-popover{grid-template-columns:1fr}
  .mff-add-new-popover{position:static;margin-top:10px;width:100%}
}


/* --- Refined Microsoft Forms editor UI: responses first + editable form canvas --- */
.mff-editor .mff-stage{
  grid-template-columns:1fr;
  padding:32px 18px 44px;
  background:#f7eef2;
  border-radius:0 0 18px 18px;
}

.mff-editor .mff-canvas-wrap{
  width:100%;
  max-width:1040px;
  margin:0 auto;
  padding-left:0;
}

.mff-editor .mff-canvas-surface{
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:0 0 28px;
  background:transparent;
  box-shadow:none;
}

.mff-editor .mff-overview-strip,
.mff-editor .mff-bottom-grid{
  display:none;
}

.mff-editor .mff-title-card{
  width:100%;
  margin:0 auto 18px;
  padding:34px 38px 28px;
  border:0;
  border-top:4px solid #9c174c;
  border-radius:2px;
  background:#fff;
  box-shadow:none;
}

.mff-editor .mff-title-form{
  gap:12px;
}

.mff-editor .mff-form-meta-row{
  justify-content:space-between;
  margin-bottom:6px;
}

.mff-editor .mff-save-pill{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:2px 10px;
  border-radius:999px;
  border:1px solid #e8ccd7;
  color:#8c1646;
  background:#fff7fa;
  font-size:.78rem;
  font-weight:700;
}

.mff-editor .mff-title-input-wrap{
  grid-template-columns:1fr;
  padding:0;
  border-bottom:0;
}

.mff-editor .mff-title-input{
  min-height:44px;
  padding:0;
  border:0;
  color:#5b5b5b;
  font-size:1.55rem;
  font-weight:800;
  letter-spacing:.01em;
}

.mff-editor .mff-description-input{
  min-height:70px;
  padding:0;
  border:0;
  color:#333;
  line-height:1.55;
  font-size:.95rem;
}

.mff-editor .mff-title-input-wrap .mff-icon-button{
  display:none;
}

.mff-editor .mff-builder-stack{
  width:100%;
  display:grid;
  gap:0;
}

.mff-editor .mff-builder-card{
  position:relative;
  width:100%;
  margin:0 auto 32px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.mff-editor .mff-builder-card-head{
  margin:0;
  padding:0;
}

.mff-editor .mff-section-inline-form{
  width:100%;
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:flex-start;
  padding:22px 28px 18px;
  background:#fff;
  border-top:4px solid #9c174c;
}

.mff-editor .mff-section-inline-form > .mff-mini-btn{
  display:none;
}

.mff-editor .mff-section-edit-fields{
  display:grid;
  gap:8px;
}

.mff-editor .mff-section-edit-fields small{
  color:#555;
  font-size:.82rem;
  font-weight:700;
}

.mff-editor .mff-section-title-input,
.mff-editor .mff-section-description-input{
  width:100%;
  border:0;
  background:transparent;
  color:#111;
  font:inherit;
  outline:0;
}

.mff-editor .mff-section-title-input{
  min-height:32px;
  font-size:1.08rem;
  font-weight:800;
}

.mff-editor .mff-section-description-input{
  min-height:42px;
  resize:vertical;
  color:#555;
}

.mff-editor .mff-question-stack{
  display:grid;
  gap:0;
}

.mff-editor .mff-question-card{
  position:relative;
  display:block;
  padding:0;
  border:0;
  border-top:1px solid #e8e8e8;
  border-radius:0;
  background:#f6f6f6;
  box-shadow:none;
}

.mff-editor .mff-question-card:first-child{
  border-top:0;
}

.mff-editor .mff-question-card.is-active,
.mff-editor .mff-question-card:focus-within{
  outline:2px solid rgba(156,23,76,.16);
  background:#f5f5f5;
}

.mff-editor .mff-question-inline-form{
  display:block;
  padding:24px 28px 18px;
}

.mff-editor .mff-question-card-main{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:10px;
}

.mff-editor .mff-question-number{
  padding-top:7px;
  color:#111;
  font-size:.9rem;
  font-weight:700;
  text-align:right;
}

.mff-editor .mff-question-edit-area{
  display:grid;
  gap:14px;
}

.mff-editor .mff-question-title-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 210px;
  gap:12px;
  align-items:start;
}

.mff-editor .mff-question-title-input,
.mff-editor .mff-question-description-input,
.mff-editor .mff-question-type-select,
.mff-editor .mff-preview-input,
.mff-editor .mff-edit-option-row input{
  width:100%;
  min-height:38px;
  border:1px solid transparent;
  border-radius:4px;
  background:#fff;
  color:#111;
  font:inherit;
  outline:0;
}

.mff-editor .mff-question-title-input{
  padding:8px 10px;
  border-bottom:1px solid #bfbfbf;
  font-weight:800;
}

.mff-editor .mff-question-description-input{
  padding:8px 10px;
  color:#444;
}

.mff-editor .mff-question-type-select{
  padding:8px 10px;
  border-color:#d6d6d6;
}

.mff-editor .mff-question-title-input:focus,
.mff-editor .mff-question-description-input:focus,
.mff-editor .mff-question-type-select:focus,
.mff-editor .mff-edit-option-row input:focus{
  border-color:#9c174c;
  box-shadow:0 0 0 3px rgba(156,23,76,.1);
}

.mff-editor .mff-answer-preview{
  display:grid;
  gap:10px;
  padding:4px 0 8px;
}

.mff-editor .mff-preview-input{
  max-width:100%;
  padding:9px 10px;
  border-color:#cfcfcf;
  color:#888;
  background:#fff;
}

.mff-editor .mff-preview-input.is-long{
  min-height:82px;
  resize:none;
}

.mff-editor .mff-edit-option-list{
  display:grid;
  gap:10px;
}

.mff-editor .mff-edit-option-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr) 36px;
  gap:10px;
  align-items:center;
  max-width:680px;
}

.mff-editor .mff-option-dot,
.mff-editor .mff-option-square{
  display:inline-flex;
  width:18px;
  height:18px;
  border:1px solid #bfbfbf;
  background:#fff;
}

.mff-editor .mff-option-dot{
  border-radius:999px;
}

.mff-editor .mff-option-square{
  border-radius:4px;
}

.mff-editor .mff-edit-option-row input{
  padding:8px 10px;
  border-color:#e0e0e0;
}

.mff-editor .mff-option-add-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-left:32px;
}

.mff-editor .mff-add-option-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:34px;
  padding:0 10px;
  border:0;
  border-radius:999px;
  color:#9c174c;
  background:transparent;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}

.mff-editor .mff-add-option-btn:hover{
  background:#f3e7ec;
}

.mff-editor .mff-rating-preview{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.mff-editor .mff-rating-preview span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border:1px solid #d2d2d2;
  border-radius:999px;
  background:#fff;
  color:#555;
  font-weight:700;
}

.mff-editor .mff-file-preview{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:max-content;
  max-width:100%;
  min-height:42px;
  padding:0 14px;
  border:1px dashed #c9c9c9;
  border-radius:8px;
  background:#fff;
  color:#555;
}

.mff-editor .mff-question-toolbar{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  min-height:50px;
  margin:12px -28px -18px;
  padding:10px 24px;
  border-top:1px solid #e2e2e2;
  background:#f0f0f0;
}

.mff-editor .mff-question-toolbar .mff-mini-btn{
  display:none;
}

.mff-editor .mff-required-toggle{
  display:flex;
  align-items:center;
  gap:10px;
  color:#111;
  font-size:.9rem;
}

.mff-editor .mff-required-toggle input{
  width:38px;
  height:20px;
  accent-color:#9c174c;
}

.mff-editor .mff-card-actions-icons{
  position:absolute;
  top:16px;
  right:18px;
  display:flex;
  align-items:center;
  gap:8px;
  z-index:2;
}

.mff-editor .mff-builder-card-head .mff-card-actions-icons{
  top:18px;
}

.mff-editor .mff-icon-button{
  border-color:transparent;
  background:transparent;
  color:#666;
}

.mff-editor .mff-icon-button:hover{
  background:#eee;
  color:#222;
}

.mff-editor .mff-icon-danger:hover{
  color:#9c174c;
  background:#f4e6ec;
}

.mff-editor .mff-builder-card-footer{
  justify-content:flex-start;
  padding:18px 8px 4px;
}

.mff-editor .mff-add-new-menu{
  margin:18px 0 10px 8px;
}

.mff-editor .mff-add-new-toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:36px;
  border:0;
  color:#9c174c;
  background:transparent;
  font-weight:800;
}

.mff-editor .mff-add-new-toggle svg{
  padding:3px;
  border-radius:999px;
  color:#fff;
  background:#9c174c;
}

.mff-editor .mff-add-new-toggle span{
  color:#9c174c;
}

.mff-editor .mff-add-new-popover{
  border-color:#ead1db;
  box-shadow:0 16px 34px rgba(60,20,36,.15);
}

.mff-editor .mff-topbar{
  position:sticky;
  top:0;
  z-index:40;
  border-radius:18px 18px 0 0;
}

.mff-editor .mff-actions [data-mff-global-save]{
  order:20;
}

.mff-editor .mff-settings-drawer{
  position:fixed;
  right:24px;
  top:110px;
  width:min(420px, calc(100vw - 48px));
  z-index:80;
  max-height:calc(100vh - 132px);
}

@media (max-width:900px){
  .mff-editor .mff-title-card,
  .mff-editor .mff-section-inline-form,
  .mff-editor .mff-question-inline-form{
    padding-left:18px;
    padding-right:18px;
  }

  .mff-editor .mff-question-title-row,
  .mff-editor .mff-question-card-main{
    grid-template-columns:1fr;
  }

  .mff-editor .mff-question-number{
    text-align:left;
    padding-top:0;
  }

  .mff-editor .mff-card-actions-icons{
    position:static;
    justify-content:flex-end;
    padding:8px 16px 12px;
  }

  .mff-editor .mff-question-toolbar{
    margin-left:-18px;
    margin-right:-18px;
  }

  .mff-editor .mff-section-inline-form{
    grid-template-columns:1fr;
  }
}


/* --- Cleaner dashboard tables --- */
.filters.table-toolbar{
  align-items:center;
  gap:12px;
  margin-bottom:18px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(160,177,204,.18);
}

.filters.table-toolbar input,
.filters.table-toolbar select{
  min-height:52px;
  padding:0 16px;
  border:1px solid #dfe7f2;
  border-radius:16px;
  color:#31405f;
  background:#fff;
  box-shadow:0 6px 16px rgba(27,39,79,.04);
}

.filters.table-toolbar input::placeholder{color:#97a3ba}
.filters.table-toolbar .btn{
  min-height:52px;
  padding:0 20px;
  border-radius:16px;
  font-weight:800;
  box-shadow:0 8px 20px rgba(27,39,79,.06);
}

.card .table-wrap,
.clean-table-wrap{
  margin-top:0;
  overflow:auto;
  border:1px solid #e6edf6;
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 36px rgba(36,55,99,.06);
}

.card .table-wrap table,
.clean-table-wrap table{
  min-width:880px;
}

.card .table-wrap th,
.clean-table-wrap th{
  position:static;
  padding:18px 16px;
  color:#7f8aa3;
  background:#f4f7fb;
  border-bottom:1px solid #e6edf6;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.card .table-wrap thead th:first-child,
.clean-table-wrap thead th:first-child{border-top-left-radius:22px}
.card .table-wrap thead th:last-child,
.clean-table-wrap thead th:last-child{border-top-right-radius:22px}

.card .table-wrap td,
.clean-table-wrap td{
  padding:18px 16px;
  color:#26344f;
  background:#fff;
  border-bottom:1px solid #eef2f7;
  vertical-align:middle;
  font-size:.9rem;
}

.card .table-wrap tbody tr:nth-child(even) td,
.clean-table-wrap tbody tr:nth-child(even) td{background:#fcfdff}

.card .table-wrap tbody tr:hover td,
.clean-table-wrap tbody tr:hover td{background:#f8fbff}

.card .table-wrap tbody tr:last-child td,
.clean-table-wrap tbody tr:last-child td{border-bottom:0}

.table-action-form{
  display:grid;
  gap:10px;
  min-width:240px;
  padding:14px;
  border:1px solid #ecf1f7;
  border-radius:16px;
  background:#f9fbfd;
}

.table-action-form select,
.table-action-form textarea,
.table-action-form input[type="datetime-local"]{
  min-height:40px;
  border:1px solid #dbe5f0;
  border-radius:12px;
  background:#fff;
  box-shadow:none;
}

.table-action-form textarea{min-height:92px}
.table-action-form .btn{width:100%;min-height:42px;border-radius:12px}

.card .table-wrap td details summary,
.clean-table-wrap td details summary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 12px;
  border:1px solid #dbe6f2;
  border-radius:999px;
  color:#315b9b;
  background:#f7faff;
  font-size:.82rem;
  font-weight:800;
  list-style:none;
}
.card .table-wrap td details summary::-webkit-details-marker,
.clean-table-wrap td details summary::-webkit-details-marker{display:none}

.card .table-wrap td pre,
.clean-table-wrap td pre{
  margin-top:10px;
  border:1px solid #e7edf5;
  border-radius:14px;
  background:#fafcff;
}

@media (max-width:840px){
  .filters.table-toolbar{padding-bottom:14px}
  .filters.table-toolbar input,
  .filters.table-toolbar select,
  .filters.table-toolbar .btn{width:100%;max-width:none}
  .table-action-form{min-width:200px}
}


/* --- Reference-style form header, metric cards, toolbar, and action alignment --- */
.mff-response-first-card{display:none!important}

.mff-management-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 0 18px;
  padding:22px 26px;
  border:1px solid #dbe6f2;
  border-radius:24px;
  background:rgba(255,255,255,.92);
  box-shadow:0 18px 42px rgba(36,55,99,.07);
}

.mff-management-head h3{
  margin:2px 0 6px;
  color:#17233c;
  font-size:clamp(1.2rem,1.5vw,1.55rem);
  letter-spacing:-.03em;
}

.mff-management-head p{
  max-width:760px;
  margin:0;
  color:#697891;
  line-height:1.55;
}

.mff-head-buttons{
  justify-content:flex-end;
  flex-wrap:wrap;
  min-width:max-content;
}

.mff-response-metric-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin:0 0 22px;
}

.mff-response-metric-card{
  min-height:112px;
  display:grid;
  align-content:center;
  gap:8px;
  padding:22px;
  border:1px solid #dfe8f4;
  border-radius:24px;
  background:linear-gradient(180deg,#fff,#f8fbff);
  box-shadow:0 16px 36px rgba(36,55,99,.06);
}

.mff-response-metric-card span{
  color:#77849c;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.mff-response-metric-card strong{
  color:#17233c;
  font-size:2rem;
  line-height:1;
}

/* Table toolbar based on reference image */
.filters.table-toolbar-modern{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:14px;
  width:100%;
  margin-bottom:18px;
  padding:0 0 18px;
  border-bottom:1px solid #edf2f8;
}

.table-search-field{
  position:relative;
  flex:0 1 320px;
  min-width:220px;
}

.table-search-field span::before{
  content:'';
  position:absolute;
  left:16px;
  top:50%;
  width:14px;
  height:14px;
  border:2px solid #a4afc3;
  border-radius:50%;
  transform:translateY(-50%);
}

.table-search-field span::after{
  content:'';
  position:absolute;
  left:28px;
  top:50%;
  width:8px;
  height:2px;
  border-radius:999px;
  background:#a4afc3;
  transform:translateY(5px) rotate(45deg);
  transform-origin:left center;
}

.table-search-field input{
  width:100%;
  max-width:none!important;
  min-height:48px!important;
  padding-left:44px!important;
  border:0!important;
  border-radius:16px!important;
  background:#fff!important;
  color:#2d3853!important;
  box-shadow:none!important;
}

.table-toolbar-spacer{
  flex:1 1 auto;
}

.table-filter-trigger{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 8px;
  border:0;
  color:#34405c;
  background:transparent;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}

.table-caret{
  width:7px;
  height:7px;
  border-right:1.8px solid #8c96aa;
  border-bottom:1.8px solid #8c96aa;
  transform:rotate(45deg) translateY(-2px);
}

.table-status-filter{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#8590a5;
  white-space:nowrap;
  font-weight:700;
}

.table-status-filter span{
  color:#8590a5;
}

.table-status-filter select{
  max-width:130px!important;
  min-height:42px!important;
  padding:0 26px 0 0!important;
  border:0!important;
  border-radius:0!important;
  color:#2d3853!important;
  background:transparent!important;
  box-shadow:none!important;
  font-weight:800;
}

.table-view-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-left:8px;
}

.table-view-toggle button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#a0a7b7;
  cursor:pointer;
}

.table-view-toggle button:hover,
.table-view-toggle button.is-active{
  background:#f0f3f8;
  color:#647089;
}

.table-view-icon{
  position:relative;
  display:block;
  width:18px;
  height:18px;
}

.table-view-icon.is-list::before{
  content:'';
  position:absolute;
  inset:1px;
  background:
    linear-gradient(#8790a3,#8790a3) 0 0/5px 5px no-repeat,
    linear-gradient(#8790a3,#8790a3) 8px 1px/10px 3px no-repeat,
    linear-gradient(#8790a3,#8790a3) 0 7px/5px 5px no-repeat,
    linear-gradient(#8790a3,#8790a3) 8px 8px/10px 3px no-repeat,
    linear-gradient(#8790a3,#8790a3) 0 14px/5px 5px no-repeat,
    linear-gradient(#8790a3,#8790a3) 8px 15px/10px 3px no-repeat;
}

.table-view-icon.is-grid::before{
  content:'';
  position:absolute;
  inset:1px;
  background:
    linear-gradient(#b5bdca,#b5bdca) 0 0/7px 7px no-repeat,
    linear-gradient(#b5bdca,#b5bdca) 10px 0/7px 7px no-repeat,
    linear-gradient(#b5bdca,#b5bdca) 0 10px/7px 7px no-repeat,
    linear-gradient(#b5bdca,#b5bdca) 10px 10px/7px 7px no-repeat;
}

/* Align right status/actions like the reference */
.clean-table-wrap th:last-child,
.clean-table-wrap td:last-child,
.card .table-wrap th:last-child,
.card .table-wrap td:last-child{
  text-align:right;
}

.clean-table-wrap td:last-child,
.card .table-wrap td:last-child{
  vertical-align:middle;
}

.table-action-form{
  margin-left:auto;
}

.table-actions-pill,
.clean-table-wrap td:last-child form:not(.table-action-form),
.card .table-wrap td:last-child form:not(.table-action-form){
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  width:max-content;
  margin-left:auto;
  padding:6px 8px;
  border-radius:999px;
  background:#f3f4f6;
}

.clean-table-wrap td:last-child .btn,
.card .table-wrap td:last-child .btn{
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  box-shadow:none;
}

/* Functional grid view for table toggle */
.clean-table-wrap.is-grid-view,
.card .table-wrap.is-grid-view{
  border:0;
  background:transparent;
  box-shadow:none;
}

.clean-table-wrap.is-grid-view table,
.card .table-wrap.is-grid-view table{
  min-width:0;
  border-collapse:separate;
}

.clean-table-wrap.is-grid-view thead,
.card .table-wrap.is-grid-view thead{
  display:none;
}

.clean-table-wrap.is-grid-view tbody,
.card .table-wrap.is-grid-view tbody{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
}

.clean-table-wrap.is-grid-view tr,
.card .table-wrap.is-grid-view tr{
  display:grid;
  gap:0;
  padding:12px;
  border:1px solid #e4ebf5;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 28px rgba(36,55,99,.06);
}

.clean-table-wrap.is-grid-view td,
.card .table-wrap.is-grid-view td{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:10px 6px;
  border-bottom:1px solid #f0f3f8;
  background:transparent!important;
  text-align:right;
}

.clean-table-wrap.is-grid-view td:last-child,
.card .table-wrap.is-grid-view td:last-child{
  border-bottom:0;
}

.clean-table-wrap.is-grid-view td::before,
.card .table-wrap.is-grid-view td::before{
  content:attr(data-label);
  flex:0 0 auto;
  color:#7f8aa3;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:left;
}

@media (max-width:980px){
  .mff-management-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .mff-head-buttons,
  .mff-head-buttons .mff-btn{
    width:100%;
  }
  .mff-response-metric-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .filters.table-toolbar-modern{
    flex-wrap:wrap;
  }
  .table-search-field{
    flex:1 1 100%;
  }
  .table-toolbar-spacer{
    display:none;
  }
}

@media (max-width:620px){
  .mff-response-metric-grid{
    grid-template-columns:1fr;
  }
  .table-filter-trigger,
  .table-status-filter,
  .table-status-filter select,
  .table-view-toggle{
    width:100%;
  }
  .table-view-toggle{
    justify-content:flex-end;
  }
}


/* Hide redundant form-page intro and compact action toolbar */
.table-toolbar-modern .table-toolbar-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  margin-left:auto;
  flex-wrap:wrap;
}

.table-toolbar-modern .table-toolbar-actions .mff-btn{
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  white-space:nowrap;
}

.mff-shell > .mff-response-metric-grid:first-child{
  margin-top:0;
}

@media (max-width: 980px){
  .table-toolbar-modern .table-toolbar-actions{
    width:100%;
    justify-content:flex-start;
  }
  .table-toolbar-modern .table-toolbar-actions .mff-btn{
    width:100%;
  }
}


/* --- System-style buttons for response tools --- */
.mff-btn,
.tool-btn,
.mff-action-link,
.mff-mini-btn,
.mff-add-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 16px;
  border:1px solid transparent;
  border-radius:var(--radius-sm);
  font:inherit;
  font-weight:700;
  line-height:1.15;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),color var(--transition),transform var(--transition);
}

.mff-btn:hover,
.tool-btn:hover,
.mff-action-link:hover,
.mff-mini-btn:hover,
.mff-add-link:hover{
  transform:translateY(-1px);
  text-decoration:none;
}

.mff-btn svg,
.tool-btn svg,
.mff-action-link svg,
.mff-mini-btn svg,
.mff-add-link svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
}

.mff-btn-primary,
.tool-btn-primary{
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  border-color:rgba(255,255,255,.76);
  box-shadow:0 12px 24px rgba(var(--primary-strong-rgb),.22);
}

.mff-btn-primary:hover,
.tool-btn-primary:hover{
  color:var(--surface);
  background:linear-gradient(135deg,var(--primary-strong),var(--primary-deep));
}

.mff-btn-outline,
.tool-btn-outline,
.mff-action-link,
.mff-mini-btn,
.mff-add-link{
  color:var(--primary-deep);
  background:var(--surface-glass);
  border-color:var(--border);
  box-shadow:var(--shadow-xs);
}

.mff-btn-outline:hover,
.tool-btn-outline:hover,
.mff-action-link:hover,
.mff-mini-btn:hover,
.mff-add-link:hover{
  background:var(--surface);
  border-color:var(--border-strong);
}

.tool-btn-ghost{
  color:var(--primary-deep);
  background:transparent;
  border-color:transparent;
  box-shadow:none;
}

.tool-btn-ghost:hover{
  background:var(--surface-glass);
  border-color:var(--border);
  box-shadow:var(--shadow-xs);
}

.mff-btn.danger,
.mff-mini-btn.is-danger,
.mff-icon-danger{
  color:var(--danger);
  border-color:var(--danger-border);
  background:var(--danger-bg);
}

/* Toolbar: search fills the remaining width; tools stay aligned right. */
.filters.table-toolbar-modern.unified-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  flex-wrap:nowrap;
  padding:0 0 18px;
  margin-bottom:18px;
  border-bottom:1px solid var(--border);
}

.unified-toolbar .table-search-field{
  flex:1 1 auto;
  min-width:260px;
  max-width:none;
}

.unified-toolbar .table-search-field input{
  width:100%;
  max-width:none!important;
  min-height:46px;
  padding-left:46px!important;
  border:1px solid var(--border-strong)!important;
  border-radius:var(--radius-sm)!important;
  background:var(--surface)!important;
  color:var(--text)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72)!important;
}

.unified-toolbar .table-search-field input:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.62)!important;
  box-shadow:var(--focus-ring)!important;
}

.table-toolbar-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex:0 0 auto;
  margin-left:auto;
  white-space:nowrap;
}

.tool-select{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text-soft);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
  font-weight:700;
}

.tool-select span{
  color:var(--text-soft);
  font-size:.9rem;
}

.tool-select select{
  width:auto!important;
  min-height:38px!important;
  max-width:140px!important;
  padding:0 24px 0 0!important;
  border:0!important;
  border-radius:0!important;
  color:var(--text)!important;
  background:transparent!important;
  box-shadow:none!important;
  font:inherit;
  font-weight:800;
}

.unified-toolbar .table-view-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:42px;
  padding:4px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface-glass);
  box-shadow:var(--shadow-xs);
}

.unified-toolbar .table-view-toggle button{
  width:34px;
  height:34px;
  border-radius:var(--radius-xs);
}

.unified-toolbar .table-view-toggle button.is-active,
.unified-toolbar .table-view-toggle button:hover{
  background:var(--surface);
}

.mff-editor .mff-topbar{
  border:1px solid var(--border);
  background:var(--surface-glass-strong);
  box-shadow:var(--shadow-sm);
}

.mff-editor .mff-actions{
  gap:10px;
}

.mff-editor .mff-action-link{
  min-height:42px;
  padding:10px 14px;
}

.form-builder-page-intro{
  margin-bottom:18px;
}

.mff-response-metric-card{
  border:1px solid var(--border)!important;
  background:var(--surface-glass-strong)!important;
  box-shadow:var(--shadow-sm)!important;
}

.mff-response-metric-card strong{
  color:var(--text)!important;
}

.clean-table-wrap th:last-child,
.clean-table-wrap td:last-child,
.card .table-wrap th:last-child,
.card .table-wrap td:last-child{
  text-align:right!important;
}

@media (max-width:1180px){
  .filters.table-toolbar-modern.unified-toolbar{
    align-items:stretch;
    flex-wrap:wrap;
  }

  .unified-toolbar .table-search-field{
    flex:1 1 100%;
    min-width:100%;
  }

  .table-toolbar-tools{
    width:100%;
    justify-content:flex-end;
    flex-wrap:wrap;
  }
}

@media (max-width:720px){
  .table-toolbar-tools,
  .tool-btn,
  .tool-select,
  .unified-toolbar .table-view-toggle{
    width:100%;
  }

  .tool-select{
    justify-content:space-between;
  }

  .mff-editor .mff-actions,
  .mff-editor .mff-actions .mff-btn,
  .mff-editor .mff-actions .mff-action-link,
  .mff-editor .mff-actions form{
    width:100%;
  }
}


/* --- Final form management layout: reference layout, system visual style --- */
.mff-shell{
  display:grid;
  gap:18px;
}

.mff-editor .mff-topbar{
  position:sticky;
  top:calc(var(--content-top-padding) + 2px);
  z-index:45;
  display:flex!important;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  width:100%;
  padding:14px 16px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0!important;
  background:var(--surface-glass-strong)!important;
  box-shadow:var(--shadow-sm)!important;
  backdrop-filter:blur(18px);
}

.mff-editor .mff-titlebar{
  display:none!important;
}

.mff-editor .mff-actions{
  display:flex!important;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  width:100%;
  flex-wrap:wrap;
}

.mff-editor .mff-inline-action{
  display:inline-flex;
  margin:0;
}

.mff-editor .mff-responses-link{
  position:relative;
  padding-right:18px;
}

.mff-action-count{
  position:absolute;
  top:-9px;
  right:-7px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border:2px solid var(--surface);
  border-radius:var(--radius-pill);
  color:var(--surface);
  background:var(--danger);
  font-size:.72rem;
  line-height:1;
  box-shadow:var(--shadow-xs);
}

.mff-editor .mff-stage{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:0;
  padding:28px!important;
  border:1px solid var(--border)!important;
  border-top:0!important;
  border-radius:0 0 var(--radius-lg) var(--radius-lg)!important;
  background:
    radial-gradient(circle at 0 0, rgba(var(--primary-rgb),.12), transparent 28%),
    linear-gradient(145deg, var(--page-bg), var(--page-bg-2))!important;
}

.mff-editor .mff-canvas-wrap{
  width:100%;
  max-width:1120px!important;
  margin:0 auto!important;
  padding:0!important;
}

.mff-editor .mff-canvas-surface{
  display:grid;
  gap:18px;
  width:100%;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.mff-editor .mff-title-card,
.mff-editor .mff-quickstart,
.mff-editor .mff-builder-card,
.mff-editor .mff-bottom-card{
  width:100%!important;
  margin:0!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-lg)!important;
  background:var(--surface-glass-strong)!important;
  box-shadow:var(--shadow-sm)!important;
  overflow:hidden;
}

.mff-editor .mff-title-card{
  padding:30px 34px 28px!important;
  border-top:1px solid var(--border)!important;
}

.mff-editor .mff-title-form{
  gap:14px!important;
}

.mff-editor .mff-form-meta-row{
  justify-content:flex-start!important;
  gap:10px!important;
  margin-bottom:4px!important;
}

.mff-editor .mff-badge,
.mff-editor .mff-save-pill{
  border-radius:var(--radius-pill)!important;
  font-weight:800!important;
}

.mff-editor .mff-save-pill{
  min-height:28px!important;
  padding:3px 10px!important;
  border:1px solid var(--border)!important;
  color:var(--primary-deep)!important;
  background:var(--primary-soft)!important;
  font-size:.78rem!important;
}

.mff-editor .mff-title-input-wrap{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  padding:0!important;
  border:0!important;
}

.mff-editor .mff-title-input,
.mff-editor .mff-description-input{
  width:100%!important;
  border:1px solid transparent!important;
  border-radius:var(--radius-sm)!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
}

.mff-editor .mff-title-input{
  min-height:44px!important;
  padding:0!important;
  font-size:clamp(1.45rem,2.2vw,2rem)!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
}

.mff-editor .mff-description-input{
  min-height:76px!important;
  padding:0!important;
  color:var(--text-soft)!important;
  line-height:1.6!important;
  resize:vertical!important;
}

.mff-editor .mff-title-input:hover,
.mff-editor .mff-description-input:hover,
.mff-editor .mff-title-input:focus,
.mff-editor .mff-description-input:focus{
  padding:8px 10px!important;
  border-color:var(--border-strong)!important;
  background:var(--surface)!important;
}

.mff-editor .mff-title-input:focus,
.mff-editor .mff-description-input:focus{
  box-shadow:var(--focus-ring)!important;
}

.mff-editor .mff-title-input-wrap .mff-icon-button{
  display:none!important;
}

.mff-editor .mff-quickstart{
  padding:24px!important;
}

.mff-editor .mff-section-title h3{
  color:var(--text)!important;
  font-size:1.35rem!important;
}

.mff-editor .mff-heading-icon{
  background:linear-gradient(135deg,var(--primary),var(--primary-deep))!important;
}

.mff-editor .mff-quickstart-grid{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;
  gap:12px!important;
}

.mff-editor .mff-quick-card{
  min-height:62px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-md)!important;
  background:var(--surface)!important;
  box-shadow:var(--shadow-xs)!important;
}

.mff-editor .mff-quick-card:hover{
  border-color:var(--border-strong)!important;
  background:var(--surface-soft)!important;
}

.mff-editor .mff-builder-stack{
  display:grid!important;
  gap:18px!important;
  width:100%!important;
}

.mff-editor .mff-builder-card{
  position:relative;
  padding:0!important;
  border-top:1px solid var(--border)!important;
}

.mff-editor .mff-builder-card-head{
  margin:0!important;
  padding:0!important;
  border-bottom:1px solid var(--border)!important;
  background:linear-gradient(180deg,var(--surface),var(--surface-soft))!important;
}

.mff-editor .mff-section-inline-form{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:14px!important;
  align-items:start!important;
  padding:24px 28px!important;
  border:0!important;
  background:transparent!important;
}

.mff-editor .mff-section-inline-form > .mff-mini-btn{
  display:none!important;
}

.mff-editor .mff-section-edit-fields{
  display:grid!important;
  gap:8px!important;
}

.mff-editor .mff-section-edit-fields small{
  color:var(--muted)!important;
  font-size:.82rem!important;
  font-weight:800!important;
  letter-spacing:.02em;
}

.mff-editor .mff-section-title-input,
.mff-editor .mff-section-description-input{
  width:100%!important;
  border:1px solid transparent!important;
  border-radius:var(--radius-sm)!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
}

.mff-editor .mff-section-title-input{
  min-height:38px!important;
  padding:0!important;
  font-size:1.15rem!important;
  font-weight:800!important;
}

.mff-editor .mff-section-description-input{
  min-height:48px!important;
  padding:0!important;
  color:var(--text-soft)!important;
  line-height:1.55!important;
  resize:vertical!important;
}

.mff-editor .mff-section-title-input:hover,
.mff-editor .mff-section-description-input:hover,
.mff-editor .mff-section-title-input:focus,
.mff-editor .mff-section-description-input:focus{
  padding:8px 10px!important;
  border-color:var(--border-strong)!important;
  background:var(--surface)!important;
}

.mff-editor .mff-section-title-input:focus,
.mff-editor .mff-section-description-input:focus{
  box-shadow:var(--focus-ring)!important;
}

.mff-editor .mff-question-stack{
  display:grid!important;
  gap:14px!important;
  padding:18px!important;
  background:rgba(255,255,255,.48)!important;
}

.mff-editor .mff-question-card{
  position:relative!important;
  display:block!important;
  padding:0!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-md)!important;
  background:var(--surface)!important;
  box-shadow:var(--shadow-xs)!important;
  overflow:hidden!important;
}

.mff-editor .mff-question-card:first-child{
  border-top:1px solid var(--border)!important;
}

.mff-editor .mff-question-card.is-active,
.mff-editor .mff-question-card:focus-within{
  border-color:rgba(var(--primary-rgb),.55)!important;
  outline:0!important;
  box-shadow:var(--focus-ring), var(--shadow-sm)!important;
  background:var(--surface)!important;
}

.mff-editor .mff-question-inline-form{
  display:block!important;
  width:100%!important;
  padding:22px 24px 18px!important;
}

.mff-editor .mff-question-card-main{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:12px!important;
}

.mff-editor .mff-question-number{
  padding-top:9px!important;
  color:var(--text-soft)!important;
  font-size:.92rem!important;
  font-weight:800!important;
  text-align:right!important;
}

.mff-editor .mff-question-edit-area{
  display:grid!important;
  gap:14px!important;
}

.mff-editor .mff-question-title-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 220px!important;
  gap:12px!important;
  align-items:start!important;
}

.mff-editor .mff-question-title-input,
.mff-editor .mff-question-description-input,
.mff-editor .mff-question-type-select,
.mff-editor .mff-preview-input,
.mff-editor .mff-edit-option-row input{
  width:100%!important;
  min-height:42px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-sm)!important;
  background:var(--surface)!important;
  color:var(--text)!important;
  box-shadow:none!important;
  outline:0!important;
}

.mff-editor .mff-question-title-input{
  padding:9px 12px!important;
  border-bottom:1px solid var(--border-strong)!important;
  font-weight:800!important;
}

.mff-editor .mff-question-description-input,
.mff-editor .mff-question-type-select,
.mff-editor .mff-preview-input,
.mff-editor .mff-edit-option-row input{
  padding:9px 12px!important;
}

.mff-editor .mff-question-description-input{
  color:var(--text-soft)!important;
}

.mff-editor .mff-question-title-input:focus,
.mff-editor .mff-question-description-input:focus,
.mff-editor .mff-question-type-select:focus,
.mff-editor .mff-preview-input:focus,
.mff-editor .mff-edit-option-row input:focus{
  border-color:rgba(var(--primary-rgb),.62)!important;
  box-shadow:var(--focus-ring)!important;
}

.mff-editor .mff-answer-preview{
  display:grid!important;
  gap:10px!important;
  padding:2px 0 8px!important;
}

.mff-editor .mff-preview-input{
  color:var(--muted)!important;
  background:var(--surface-soft)!important;
}

.mff-editor .mff-preview-input.is-long{
  min-height:88px!important;
  resize:none!important;
}

.mff-editor .mff-edit-option-list{
  display:grid!important;
  gap:10px!important;
}

.mff-editor .mff-edit-option-row{
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr) 38px!important;
  gap:10px!important;
  align-items:center!important;
  max-width:720px!important;
}

.mff-editor .mff-option-dot,
.mff-editor .mff-option-square{
  display:inline-flex!important;
  width:18px!important;
  height:18px!important;
  border:1px solid var(--border-strong)!important;
  background:var(--surface)!important;
}

.mff-editor .mff-option-dot{
  border-radius:var(--radius-pill)!important;
}

.mff-editor .mff-option-square{
  border-radius:5px!important;
}

.mff-editor .mff-option-add-row{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin-left:32px!important;
}

.mff-editor .mff-add-option-btn{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  min-height:34px!important;
  padding:0 10px!important;
  border:0!important;
  border-radius:var(--radius-pill)!important;
  color:var(--primary-deep)!important;
  background:transparent!important;
  font:inherit!important;
  font-weight:800!important;
}

.mff-editor .mff-add-option-btn:hover{
  background:var(--primary-soft)!important;
}

.mff-editor .mff-rating-preview{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}

.mff-editor .mff-rating-preview span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:38px!important;
  height:38px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-pill)!important;
  background:var(--surface-soft)!important;
  color:var(--text-soft)!important;
  font-weight:800!important;
}

.mff-editor .mff-file-preview{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:42px!important;
  padding:0 14px!important;
  border:1px dashed var(--border-strong)!important;
  border-radius:var(--radius-sm)!important;
  background:var(--surface-soft)!important;
  color:var(--text-soft)!important;
}

.mff-editor .mff-question-toolbar{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  min-height:54px!important;
  margin:16px -24px -18px!important;
  padding:10px 24px!important;
  border-top:1px solid var(--border)!important;
  background:var(--surface-soft)!important;
}

.mff-editor .mff-required-toggle{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  min-height:36px!important;
  padding:0 10px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-pill)!important;
  color:var(--text)!important;
  background:var(--surface)!important;
  font-size:.9rem!important;
  font-weight:800!important;
}

.mff-editor .mff-required-toggle input{
  width:auto!important;
  height:auto!important;
  accent-color:var(--primary)!important;
}

.mff-editor .mff-card-actions-icons{
  position:absolute!important;
  top:14px!important;
  right:16px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  z-index:2!important;
}

.mff-editor .mff-builder-card-head .mff-card-actions-icons{
  top:18px!important;
  right:18px!important;
}

.mff-editor .mff-icon-button{
  width:38px!important;
  height:38px!important;
  border:1px solid transparent!important;
  border-radius:var(--radius-sm)!important;
  background:transparent!important;
  color:var(--muted)!important;
  box-shadow:none!important;
}

.mff-editor .mff-icon-button:hover{
  border-color:var(--border)!important;
  background:var(--surface-soft)!important;
  color:var(--text)!important;
}

.mff-editor .mff-icon-danger:hover{
  color:var(--danger)!important;
  border-color:var(--danger-border)!important;
  background:var(--danger-bg)!important;
}

.mff-editor .mff-builder-card-footer{
  display:flex!important;
  justify-content:flex-start!important;
  padding:0 18px 18px!important;
  margin:0!important;
  background:rgba(255,255,255,.48)!important;
}

.mff-editor .mff-add-new-menu{
  justify-content:flex-start!important;
  margin:14px 0 0!important;
}

.mff-editor .mff-add-new-toggle{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:38px!important;
  padding:0 14px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-pill)!important;
  color:var(--primary-deep)!important;
  background:var(--surface)!important;
  box-shadow:var(--shadow-xs)!important;
  font-weight:800!important;
}

.mff-editor .mff-add-new-toggle svg{
  padding:3px!important;
  border-radius:var(--radius-pill)!important;
  color:var(--surface)!important;
  background:linear-gradient(135deg,var(--primary),var(--primary-deep))!important;
}

.mff-editor .mff-add-new-toggle span{
  color:var(--primary-deep)!important;
}

.mff-editor .mff-add-new-popover{
  top:46px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-md)!important;
  background:var(--surface)!important;
  box-shadow:var(--shadow-md)!important;
}

.mff-editor .mff-add-new-popover button{
  min-height:42px!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-sm)!important;
  color:var(--text)!important;
  background:var(--surface-soft)!important;
}

.mff-editor .mff-add-new-popover button:hover{
  color:var(--primary-deep)!important;
  border-color:var(--border-strong)!important;
  background:var(--primary-soft)!important;
}

.mff-editor .mff-empty-state{
  padding:20px!important;
  border:1px dashed var(--border-strong)!important;
  border-radius:var(--radius-md)!important;
  background:var(--surface)!important;
}

.mff-editor .mff-empty-builder{
  padding:24px!important;
}

.mff-editor .mff-bottom-grid,
.mff-editor .mff-overview-strip{
  display:none!important;
}

.mff-editor .mff-settings-drawer{
  position:fixed!important;
  right:24px!important;
  top:110px!important;
  z-index:80!important;
  width:min(420px, calc(100vw - 48px))!important;
  max-height:calc(100vh - 132px)!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius-lg)!important;
  background:var(--surface-glass-strong)!important;
  box-shadow:var(--shadow-lg)!important;
  backdrop-filter:blur(18px);
}

.mff-editor .mff-settings-head h3{
  color:var(--text)!important;
  font-size:1.45rem!important;
}

.mff-editor .mff-settings-group{
  border:1px solid var(--border)!important;
  border-radius:var(--radius-md)!important;
  background:var(--surface-soft)!important;
}

.mff-editor .mff-settings-group h4{
  color:var(--text)!important;
}

.mff-editor .mff-choice-row input{
  accent-color:var(--primary)!important;
}

@media (max-width:980px){
  .mff-editor .mff-topbar{
    position:relative!important;
    top:auto!important;
  }

  .mff-editor .mff-actions,
  .mff-editor .mff-actions .mff-btn,
  .mff-editor .mff-actions .mff-action-link,
  .mff-editor .mff-actions form{
    width:100%!important;
  }

  .mff-editor .mff-stage{
    padding:18px!important;
  }

  .mff-editor .mff-title-card{
    padding:24px 20px!important;
  }

  .mff-editor .mff-section-inline-form,
  .mff-editor .mff-question-inline-form{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  .mff-editor .mff-question-title-row,
  .mff-editor .mff-question-card-main,
  .mff-editor .mff-section-inline-form{
    grid-template-columns:1fr!important;
  }

  .mff-editor .mff-question-number{
    text-align:left!important;
    padding-top:0!important;
  }

  .mff-editor .mff-card-actions-icons{
    position:static!important;
    justify-content:flex-end!important;
    padding:8px 16px 12px!important;
  }

  .mff-editor .mff-question-toolbar{
    margin-left:-18px!important;
    margin-right:-18px!important;
  }
}

@media (max-width:640px){
  .mff-editor .mff-stage{
    padding:14px!important;
  }

  .mff-editor .mff-title-input{
    font-size:1.35rem!important;
  }

  .mff-editor .mff-add-new-popover{
    position:static!important;
    width:100%!important;
    grid-template-columns:1fr!important;
    margin-top:10px!important;
  }
}

/* --- PDF-only form management layout --- */



.mff-manager-kicker{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--primary-soft);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}



.mff-manager-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  min-width:min(100%,420px);
}

.mff-inline-action{display:inline-flex;margin:0}





















.mff-guide-status-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.mff-guide-status-row > span:last-child{
  color:var(--muted);
  font-weight:800;
  font-size:.86rem;
}

.mff-guide-list{
  display:grid;
  gap:10px;
}

.mff-guide-list span{
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--text);
  font-weight:700;
}

.mff-guide-list svg{
  color:var(--primary-deep);
  flex:0 0 auto;
}

.mff-guide-note{
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  color:var(--text-soft);
  line-height:1.55;
}

.mff-generated-review{
  display:grid;
  gap:16px;
  padding:20px;
}

.mff-review-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,.45fr);
  gap:16px;
  align-items:start;
}

.mff-review-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.mff-review-meta span{
  display:grid;
  gap:3px;
  min-height:58px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface-soft);
  color:var(--muted);
  font-size:.82rem;
  font-weight:800;
}

.mff-review-meta strong{
  color:var(--text);
  font-size:.95rem;
}

.mff-generated-section-list{
  display:grid;
  gap:14px;
}

.mff-generated-section-card{
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:var(--surface-soft);
}

.mff-generated-section-head{
  display:grid;
  gap:5px;
  padding:16px 18px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,var(--surface),var(--surface-soft));
}

.mff-generated-section-head span,
.mff-generated-section-head small{
  color:var(--muted);
  font-size:.82rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.mff-generated-section-head h4{
  margin:0;
  color:var(--text);
  font-size:1.08rem;
}

.mff-generated-question-list{
  display:grid;
  gap:10px;
  padding:14px;
}

.mff-generated-question-item{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  padding:14px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow-xs);
}

.mff-generated-question-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:var(--radius-pill);
  color:var(--primary-deep);
  background:var(--primary-soft);
  font-weight:900;
}

.mff-generated-question-body{
  display:grid;
  gap:8px;
}

.mff-generated-question-title{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.mff-generated-question-title strong{
  color:var(--text);
}

.mff-generated-question-body p{
  margin:0;
  color:var(--text-soft);
}

.mff-required-pill,
.mff-type-pill,
.mff-generated-options span{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 9px;
  border-radius:var(--radius-pill);
  font-size:.78rem;
  font-weight:900;
}

.mff-required-pill{
  color:var(--danger);
  background:var(--danger-bg);
  border:1px solid var(--danger-border);
}

.mff-type-pill{
  color:var(--primary-deep);
  background:var(--primary-soft);
  border:1px solid rgba(var(--primary-rgb),.24);
  white-space:nowrap;
}

.mff-generated-options{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.mff-generated-options span{
  color:var(--text-soft);
  background:var(--surface-soft);
  border:1px solid var(--border);
}







@media (max-width:1080px){
      .mff-manager-actions{
    justify-content:flex-start;
    min-width:0;
  }
}

@media (max-width:720px){
    .mff-manager-actions,
  .mff-manager-actions .mff-btn,
  .mff-manager-actions .mff-action-link,
  .mff-manager-actions .mff-inline-action,
      .mff-generated-question-item{
    grid-template-columns:1fr;
  }
  .mff-type-pill{
    width:max-content;
  }
  }

/* Removed PDF generator feature styles */
.page-intro{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.page-intro-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.mff-student-preview-frame{
  padding:0;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,var(--surface-soft),var(--surface));
  overflow:hidden;
}

.mff-student-preview-frame .msf-page{
  padding:0;
}

.mff-student-preview-frame .msf-frame{
  width:100%;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent;
}

.mff-student-preview-frame .msf-intro{
  min-height:300px;
}

@media (max-width: 720px){
  .page-intro-actions,
  .page-intro-actions .btn{
    width:100%;
  }
}

/* --- Requested PDF generator and focus-mode refinements --- */
.page-intro-actions .btn{
  min-height:52px;
  padding-inline:24px;
  box-shadow:0 14px 28px rgba(var(--primary-strong-rgb),.18);
}



.mff-manager-actions{
  flex-wrap:nowrap;
  min-width:0;
}

.mff-manager-actions .mff-action-link,
.mff-manager-actions .mff-btn{
  min-height:50px;
  white-space:nowrap;
}

.mff-manager-actions .mff-inline-action{
  flex:0 0 auto;
}

@media (max-width:840px){
  body.form-focus .sidebar{
    width:var(--sidebar-mobile-width);
    min-width:var(--sidebar-mobile-width);
    max-width:var(--sidebar-mobile-width);
    padding-left:10px;
    padding-right:10px;
  }

  body.form-focus .content-wrap{
    margin-left:0;
  }

  body.form-focus .sidebar-brand-text,
  body.form-focus .nav-label,
  body.form-focus .btn-label{
    width:auto;
    max-width:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  body.form-focus .sidebar-nav .nav-link,
  body.form-focus .sidebar-footer .btn{
    justify-content:flex-start;
    gap:7px;
    padding-left:8px;
    padding-right:8px;
  }
}

@media (max-width:720px){
  .mff-manager-actions{
    flex-wrap:wrap;
  }
}


/* --- Polished PDF generator / responses refinements --- */
.page-intro{
  position:relative;
  align-items:flex-start;
  padding:28px 30px;
  border-color:rgba(var(--primary-rgb),.14);
  background:
    radial-gradient(circle at top right, rgba(var(--primary-rgb),.09), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,247,255,.92));
  box-shadow:0 18px 45px rgba(39,68,112,.07);
}

.page-intro > div:first-child{
  min-width:0;
  flex:1 1 520px;
}

.page-intro-actions{
  margin-left:auto;
  align-self:flex-start;
}

.page-intro-actions .btn,
.mff-manager-actions .mff-btn,
.mff-manager-actions .mff-action-link,
.tool-btn,
.filters.table-toolbar .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:46px;
  padding:0 18px;
  border-radius:15px;
  border:1px solid rgba(var(--primary-rgb),.18);
  font-weight:800;
  letter-spacing:-.02em;
  box-shadow:0 10px 24px rgba(39,68,112,.08);
  transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition), background var(--transition), color var(--transition);
}

.page-intro-actions .btn:hover,
.mff-manager-actions .mff-btn:hover,
.mff-manager-actions .mff-action-link:hover,
.tool-btn:hover,
.filters.table-toolbar .btn:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 30px rgba(39,68,112,.12);
}

.page-intro-actions .btn.btn-primary,
.mff-btn-primary{
  border-color:rgba(var(--primary-strong-rgb),.38);
  background:linear-gradient(135deg,var(--primary-strong),var(--primary-deep));
  color:#fff;
}

.page-intro-actions .btn.btn-outline,
.tool-btn-outline,
.mff-action-link{
  background:rgba(255,255,255,.86);
  color:var(--primary-deep);
}



.mff-manager-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
}

.mff-manager-actions form{
  display:inline-flex;
  margin:0;
}





/* Settings is now a real modal, not a side drawer. */
.mff-settings-modal.fm-modal{
  z-index:2600;
  place-items:center;
  background:rgba(12,24,45,.42);
  backdrop-filter:blur(14px);
}

.mff-settings-modal.fm-modal.is-open{
  display:grid !important;
}

.mff-settings-card{
  width:min(820px, calc(100vw - 32px));
  max-height:min(86vh, 860px);
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72);
  border-radius:26px;
  background:rgba(255,255,255,.97);
  box-shadow:0 30px 90px rgba(22,45,87,.22);
}

.mff-settings-card .mff-settings-head{
  position:sticky;
  top:0;
  z-index:2;
  margin:0;
  padding:22px 24px;
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
}

.mff-settings-card .mff-settings-head h3{
  margin:2px 0 0;
  color:var(--text);
  font-size:1.45rem;
}

.mff-settings-card .mff-settings-panel,
.mff-settings-card .mff-settings-quick-actions{
  padding:20px 24px;
}

.mff-settings-card .mff-settings-panel{
  display:grid;
  gap:16px;
}

.mff-settings-modal-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.mff-settings-fields-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.mff-field-full{
  grid-column:1 / -1;
}

.mff-settings-card .mff-settings-group{
  margin:0;
  border-color:rgba(var(--primary-rgb),.14);
  background:linear-gradient(180deg, rgba(249,252,255,.96), rgba(255,255,255,.96));
}

.mff-settings-card .mff-choice-row{
  border-color:rgba(var(--primary-rgb),.12);
  background:#fff;
}

.mff-settings-card .mff-choice-row:hover{
  border-color:rgba(var(--primary-rgb),.28);
  background:var(--primary-soft);
}

.mff-settings-quick-actions{
  border-top:1px solid var(--border);
  background:rgba(248,251,255,.8);
}

.mff-settings-quick-actions .mff-drawer-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.mff-settings-quick-actions form{
  margin:0;
}

.mff-mini-btn,
.mff-full-btn{
  min-height:42px;
  border-radius:14px;
  border-color:rgba(var(--primary-rgb),.18);
  background:#fff;
  color:var(--primary-deep);
  font-weight:800;
}

.mff-mini-btn:hover,
.mff-full-btn:hover{
  border-color:rgba(var(--primary-rgb),.34);
  background:var(--primary-soft);
}

.mff-full-btn.is-danger{
  color:var(--danger);
  border-color:var(--danger-border);
  background:var(--danger-bg);
}

/* Modern responses table */
.card#form-responses{
  padding:28px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:28px;
  background:rgba(255,255,255,.92);
  box-shadow:0 22px 60px rgba(39,68,112,.08);
}

.filters.table-toolbar-modern.unified-toolbar{
  gap:12px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(var(--primary-rgb),.12);
}

.table-search-field{
  flex:1 1 420px;
}

.table-search-field input,
.filters.table-toolbar input,
.filters.table-toolbar select{
  border:1px solid var(--border)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 8px 22px rgba(39,68,112,.045)!important;
}

.table-toolbar-tools{
  gap:10px;
}

.tool-select{
  min-height:48px;
  padding:0 14px;
  border:1px solid var(--border);
  border-radius:17px;
  background:#fff;
  box-shadow:0 8px 22px rgba(39,68,112,.045);
}

.tool-select span{
  color:var(--muted);
  font-weight:800;
}

.tool-select select{
  min-height:46px!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  font-weight:800;
}

.clean-table-wrap,
.card .table-wrap.clean-table-wrap{
  overflow:hidden;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:24px;
  background:#fff;
  box-shadow:0 16px 40px rgba(39,68,112,.06);
}

.clean-table-wrap table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}

.clean-table-wrap th{
  padding:16px 18px;
  color:#71819c;
  background:linear-gradient(180deg,#f7faff,#eef5fc);
  border-bottom:1px solid rgba(var(--primary-rgb),.12);
  font-size:.75rem;
  letter-spacing:.055em;
}

.clean-table-wrap td{
  padding:18px;
  border-bottom:1px solid #edf3fa;
  background:#fff;
}

.clean-table-wrap tbody tr{
  transition:transform var(--transition), box-shadow var(--transition);
}

.clean-table-wrap tbody tr:hover td{
  background:#f8fbff;
}

.clean-table-wrap tbody tr:hover td:first-child{
  box-shadow:inset 4px 0 0 rgba(var(--primary-rgb),.45);
}

.clean-table-wrap tbody tr td:first-child{
  color:var(--primary-deep);
  font-weight:800;
}

.clean-table-wrap tbody tr td[colspan]{
  padding:28px;
  color:var(--muted);
  text-align:center!important;
}

.clean-table-wrap td details summary{
  min-height:36px;
  padding:0 13px;
  border-radius:999px;
  border-color:rgba(var(--primary-rgb),.18);
  background:var(--primary-soft);
  color:var(--primary-deep);
}

.clean-table-wrap td details[open] summary{
  margin-bottom:10px;
}

.clean-table-wrap td pre{
  max-width:460px;
  max-height:230px;
  overflow:auto;
  padding:12px;
  border-color:rgba(var(--primary-rgb),.14);
  background:#f9fcff;
  color:var(--text-soft);
  font-size:.82rem!important;
}

.table-action-form{
  min-width:220px;
  gap:8px;
  padding:12px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:18px;
  background:#f8fbff;
  box-shadow:none;
}

.table-action-form select,
.table-action-form textarea,
.table-action-form input[type="datetime-local"]{
  min-height:38px;
  border-color:rgba(var(--primary-rgb),.16);
  border-radius:12px;
}

.table-action-form textarea{
  min-height:70px;
}

.table-action-form .btn{
  min-height:38px;
  border-radius:12px;
  box-shadow:none;
}

.fm-modal-head button,
.mff-icon-button{
  transition:background var(--transition), transform var(--transition), border-color var(--transition);
}

.fm-modal-head button:hover,
.mff-icon-button:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--primary-rgb),.28);
  background:var(--primary-soft);
}

@media (max-width:900px){
  .page-intro{
    padding:22px;
  }

  .page-intro-actions{
    width:100%;
    margin-left:0;
  }

  .page-intro-actions .btn{
    width:100%;
  }

  .mff-settings-modal-grid,
  .mff-settings-fields-grid,
  .mff-settings-quick-actions .mff-drawer-actions{
    grid-template-columns:1fr;
  }

  .card#form-responses{
    padding:18px;
  }
}

@media (max-width:720px){
  .mff-manager-actions{
    width:100%;
    flex-wrap:wrap;
  }

  .mff-manager-actions .mff-btn,
  .mff-manager-actions .mff-action-link,
  .mff-manager-actions form{
    width:100%;
  }

  .mff-settings-card{
    width:calc(100vw - 22px);
    max-height:90vh;
    border-radius:22px;
  }

  .filters.table-toolbar-modern.unified-toolbar{
    flex-wrap:wrap;
  }

  .table-toolbar-tools,
  .tool-btn,
  .tool-select{
    width:100%;
  }
}


/* --- Responses table toolbar/table polish update --- */
.card#form-responses{
  padding:30px 34px 34px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,252,255,.96));
  box-shadow:0 24px 70px rgba(39,68,112,.10);
}

.card#form-responses .filters.table-toolbar-modern.unified-toolbar{
  display:flex;
  align-items:center;
  gap:14px;
  padding:0 0 24px;
  margin-bottom:24px;
  border-bottom:1px solid rgba(var(--primary-rgb),.14);
}

.card#form-responses .table-search-field{
  position:relative;
  display:flex;
  align-items:center;
  flex:1 1 auto;
  min-width:280px;
  height:54px;
  padding:0 16px 0 52px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--muted);
  background:var(--surface-glass);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78), var(--shadow-xs);
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.card#form-responses .table-search-field:focus-within{
  border-color:rgba(var(--primary-rgb),.45);
  background:var(--surface);
  box-shadow:var(--focus-ring), var(--shadow-xs);
}

.card#form-responses .table-search-field span::before{
  content:'';
  position:absolute;
  left:22px;
  top:50%;
  width:16px;
  height:16px;
  border:2px solid var(--muted-soft);
  border-radius:50%;
  transform:translateY(-55%);
}

.card#form-responses .table-search-field span::after{
  content:'';
  position:absolute;
  left:35px;
  top:50%;
  width:8px;
  height:2px;
  border-radius:999px;
  background:var(--muted-soft);
  transform:translateY(6px) rotate(45deg);
  transform-origin:left center;
}

.card#form-responses .table-search-field input,
.card#form-responses .filters.table-toolbar .table-search-field input{
  width:100%;
  height:100%;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  color:var(--text)!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:.96rem;
  font-weight:500;
}

.card#form-responses .table-search-field input::placeholder{
  color:var(--muted-soft);
}

.card#form-responses .table-toolbar-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex:0 0 auto;
  margin-left:auto;
}

.card#form-responses .tool-select{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:54px;
  min-height:54px;
  padding:0 42px 0 18px;
  border:1px solid var(--border);
  border-radius:var(--radius-pill);
  color:var(--text-soft);
  background:var(--surface-glass);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78), var(--shadow-xs);
  white-space:nowrap;
}

.card#form-responses .tool-select::after{
  content:'';
  position:absolute;
  right:18px;
  top:50%;
  width:8px;
  height:8px;
  border-right:2px solid var(--primary-deep);
  border-bottom:2px solid var(--primary-deep);
  transform:translateY(-65%) rotate(45deg);
  pointer-events:none;
}

.card#form-responses .tool-select:focus-within{
  border-color:rgba(var(--primary-rgb),.45);
  background:var(--surface);
  box-shadow:var(--focus-ring), var(--shadow-xs);
}

.card#form-responses .tool-select span{
  color:#697891;
  font-size:.9rem;
  font-weight:800;
}

.card#form-responses .tool-select select,
.card#form-responses .filters.table-toolbar .tool-select select{
  width:auto!important;
  min-width:72px;
  max-width:170px!important;
  height:100%;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  color:var(--text)!important;
  background:transparent!important;
  box-shadow:none!important;
  font:inherit;
  font-size:.98rem;
  font-weight:800;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}

.card#form-responses .tool-btn,
.card#form-responses .btn{
  min-height:54px;
  border-radius:var(--radius-pill);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78), var(--shadow-xs);
}

.card#form-responses .clean-table-wrap,
.card#form-responses .table-wrap.clean-table-wrap{
  overflow:hidden;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:26px;
  background:#fff;
  box-shadow:0 18px 48px rgba(39,68,112,.075);
}

.card#form-responses .clean-table-wrap table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  table-layout:auto;
}

.card#form-responses .clean-table-wrap thead th{
  padding:20px 20px;
  color:#53627c;
  background:linear-gradient(180deg,#f8fbff 0%,#edf4fb 100%);
  border-bottom:1px solid rgba(var(--primary-rgb),.16);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
}

.card#form-responses .clean-table-wrap tbody td{
  padding:20px;
  border-bottom:1px solid #edf3fa;
  color:var(--text-soft);
  font-size:.94rem;
  vertical-align:middle;
}

.card#form-responses .clean-table-wrap tbody tr:not(.table-empty-row):hover td{
  background:#f7fbff;
}

.card#form-responses .clean-table-wrap tbody tr:last-child td{
  border-bottom:0;
}

.card#form-responses .clean-table-wrap th:last-child,
.card#form-responses .clean-table-wrap td:last-child{
  text-align:right!important;
}

.card#form-responses .clean-table-wrap tbody tr td[colspan],
.card#form-responses .clean-table-wrap tbody tr td.table-empty,
.card#form-responses .clean-table-wrap tbody tr.table-empty-row td:last-child{
  height:98px;
  padding:34px 20px!important;
  text-align:center!important;
  vertical-align:middle!important;
  color:#687892;
  background:linear-gradient(180deg,#fff,#fbfdff);
  font-size:1rem;
  font-weight:800;
}

.card#form-responses .table-empty span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 16px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:var(--radius-pill);
  background:#f8fbff;
  color:#687892;
}

@media (max-width:900px){
  .card#form-responses{
    padding:20px;
    border-radius:24px;
  }

  .card#form-responses .filters.table-toolbar-modern.unified-toolbar{
    align-items:stretch;
    flex-wrap:wrap;
  }

  .card#form-responses .table-search-field,
  .card#form-responses .table-toolbar-tools,
  .card#form-responses .tool-select,
  .card#form-responses .tool-btn{
    width:100%;
  }
}


/* --- Topbar actions polish and form-page search removal --- */
.topbar.template-topbar{
  border-color:rgba(var(--primary-rgb),.12);
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,251,255,.86));
  box-shadow:0 18px 48px rgba(39,68,112,.09);
}

.topbar.template-topbar .header-right{
  gap:12px;
}

.topbar.template-topbar.has-no-search .header-left{
  flex:1 1 auto;
}

.topbar.template-topbar.has-no-search .header-right{
  flex:0 0 auto;
  margin-left:auto;
}

.menu-toggle,
.topbar-calendar-link,
.icon-btn{
  width:46px;
  height:46px;
  min-width:46px;
  flex-basis:46px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:18px;
  color:var(--primary-deep);
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,250,255,.88));
  box-shadow:0 10px 24px rgba(39,68,112,.075), inset 0 1px 0 rgba(255,255,255,.86);
  transition:transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.menu-toggle:hover,
.topbar-calendar-link:hover,
.icon-btn:hover{
  color:var(--primary-strong);
  border-color:rgba(var(--primary-rgb),.26);
  background:#fff;
  box-shadow:0 16px 34px rgba(39,68,112,.12), inset 0 1px 0 rgba(255,255,255,.94);
  transform:translateY(-1px);
}

.menu-toggle:active,
.topbar-calendar-link:active,
.icon-btn:active{
  transform:translateY(0);
  box-shadow:0 8px 18px rgba(39,68,112,.09), inset 0 1px 0 rgba(255,255,255,.9);
}

.menu-toggle:focus-visible,
.topbar-calendar-link:focus-visible,
.icon-btn:focus-visible,
.topbar-profile:focus-visible{
  outline:0;
  border-color:rgba(var(--primary-rgb),.42);
  box-shadow:var(--focus-ring), 0 12px 26px rgba(39,68,112,.10);
}

.topbar-calendar-link svg,
.icon-btn svg,
.menu-toggle svg{
  width:19px;
  height:19px;
  color:currentColor;
  stroke-width:2.15;
}

.icon-badge{
  top:-6px;
  right:-6px;
  min-width:19px;
  height:19px;
  border:2px solid #fff;
  box-shadow:0 6px 14px rgba(191,63,74,.22);
  font-size:.66rem;
  font-weight:800;
}

.topbar-profile{
  height:46px;
  min-height:46px;
  padding:5px 14px 5px 6px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,250,255,.9));
  box-shadow:0 10px 24px rgba(39,68,112,.075), inset 0 1px 0 rgba(255,255,255,.86);
  transition:transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease;
}

.topbar-profile:hover{
  border-color:rgba(var(--primary-rgb),.25);
  background:#fff;
  box-shadow:0 16px 34px rgba(39,68,112,.12), inset 0 1px 0 rgba(255,255,255,.94);
  transform:translateY(-1px);
}

.topbar-profile-avatar{
  width:36px;
  height:36px;
  flex-basis:36px;
  box-shadow:0 8px 18px rgba(var(--primary-strong-rgb),.20);
}

.topbar-profile-text strong{
  font-size:.84rem;
  font-weight:800;
}

.topbar-profile-text span{
  color:#607089;
  font-size:.7rem;
  font-weight:600;
}

@media (max-width:840px){
  .topbar.template-topbar.has-no-search{
    flex-wrap:nowrap;
  }

  .topbar.template-topbar.has-no-search .header-right{
    width:auto;
    flex-wrap:nowrap;
  }
}

@media (max-width:520px){
  .topbar.template-topbar.has-no-search .header-left{
    flex:1 1 auto;
  }

  .topbar.template-topbar.has-no-search .header-right{
    gap:8px;
  }

  .topbar.template-topbar.has-no-search .topbar-calendar-link,
  .topbar.template-topbar.has-no-search .icon-btn,
  .topbar.template-topbar.has-no-search .menu-toggle{
    width:42px;
    height:42px;
    min-width:42px;
    flex-basis:42px;
    border-radius:16px;
  }
}

/* --- Guidance form PDF generator refinements: form-title topbar, clean header, preview-on-demand --- */









.mff-student-preview-review{
  padding:0!important;
  overflow:hidden;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

.mff-student-preview-review .mff-student-preview-frame{
  border-radius:24px;
  border:1px solid rgba(var(--primary-rgb),.14);
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,252,255,.92));
  box-shadow:0 18px 46px rgba(39,68,112,.08);
}

/* Cleaner settings modal */
.mff-settings-modal.fm-modal{
  padding:24px;
  background:rgba(11,25,48,.48)!important;
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}

.mff-settings-card{
  width:min(900px,calc(100vw - 36px));
  max-height:min(88vh,900px);
  display:flex;
  flex-direction:column;
  overflow:auto;
  border:1px solid rgba(255,255,255,.78)!important;
  border-radius:30px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,251,255,.96))!important;
  box-shadow:0 34px 100px rgba(15,35,70,.28)!important;
}

.mff-settings-card .mff-settings-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:24px 26px 18px!important;
  border-bottom:1px solid rgba(var(--primary-rgb),.12)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,251,255,.92))!important;
}

.mff-settings-card .mff-settings-head .mff-manager-kicker{
  min-height:24px;
  padding-inline:9px;
  border-color:rgba(var(--primary-rgb),.16);
  background:var(--primary-soft);
  color:var(--primary-deep);
  font-size:.7rem;
}

.mff-settings-card .mff-settings-head h3{
  margin-top:6px!important;
  font-size:1.55rem!important;
  letter-spacing:-.04em;
}

.mff-settings-card .mff-settings-head .mff-icon-button{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:15px;
  border:1px solid rgba(var(--primary-rgb),.16);
  background:#fff;
  color:var(--primary-deep);
  font-size:1.35rem;
  line-height:1;
}

.mff-settings-card .mff-settings-panel{
  padding:22px 26px!important;
  gap:16px!important;
}

.mff-settings-card .mff-settings-group{
  padding:18px!important;
  border:1px solid rgba(var(--primary-rgb),.13)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#fff,#f8fbff)!important;
  box-shadow:0 12px 30px rgba(39,68,112,.055);
}

.mff-settings-card .mff-settings-group h4{
  margin:0 0 12px!important;
  color:var(--text);
  font-size:1rem;
  letter-spacing:-.025em;
}

.mff-settings-card .mff-choice-row{
  min-height:72px;
  padding:14px!important;
  border:1px solid rgba(var(--primary-rgb),.12)!important;
  border-radius:18px!important;
  background:#fff!important;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}

.mff-settings-card .mff-choice-row + .mff-choice-row{
  margin-top:10px;
}

.mff-settings-card .mff-choice-row:hover,
.mff-settings-card .mff-choice-row:focus-within{
  transform:translateY(-1px);
  border-color:rgba(var(--primary-rgb),.34)!important;
  box-shadow:0 12px 26px rgba(39,68,112,.075);
  background:linear-gradient(180deg,#fff,var(--primary-soft))!important;
}

.mff-settings-card .mff-choice-row input[type="checkbox"]{
  width:18px;
  height:18px;
  margin-top:3px;
  accent-color:var(--primary-strong);
}

.mff-settings-fields-grid{
  gap:14px!important;
}

.mff-settings-card .mff-field{
  color:var(--text-soft);
  font-size:.85rem;
  font-weight:800;
}

.mff-settings-card .mff-field input,
.mff-settings-card .mff-field select,
.mff-settings-card .mff-field textarea{
  min-height:48px;
  border:1px solid rgba(var(--primary-rgb),.14)!important;
  border-radius:16px!important;
  background:#fff!important;
  color:var(--text)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

.mff-settings-card .mff-field textarea{
  min-height:110px;
}

.mff-settings-card .mff-field input:focus,
.mff-settings-card .mff-field select:focus,
.mff-settings-card .mff-field textarea:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.45)!important;
  box-shadow:var(--focus-ring)!important;
}

.mff-settings-card .mff-settings-actions{
  justify-content:flex-end;
  padding-top:2px;
}

.mff-settings-card .mff-settings-actions .mff-btn{
  min-height:48px;
  padding-inline:22px;
  border-radius:16px;
}

.mff-settings-quick-actions{
  margin:0!important;
  padding:20px 26px 24px!important;
  border-top:1px solid rgba(var(--primary-rgb),.12)!important;
  background:rgba(248,251,255,.9)!important;
}

.mff-settings-quick-actions .mff-drawer-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px!important;
}

.mff-settings-quick-actions .mff-mini-btn{
  min-height:44px;
  border-radius:15px;
  font-size:.86rem;
}

@media (max-width:900px){
  
  
  .mff-settings-card{
    width:calc(100vw - 24px);
    border-radius:24px!important;
  }

  .mff-settings-card .mff-settings-head,
  .mff-settings-card .mff-settings-panel,
  .mff-settings-quick-actions{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  .mff-settings-modal-grid,
  .mff-settings-fields-grid,
  .mff-settings-quick-actions .mff-drawer-actions{
    grid-template-columns:1fr!important;
  }
}

/* --- Guidance action alerts and response action buttons --- */
.guidance-modal-overlay{
  background:rgba(24,35,58,.34);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.guidance-modal{
  width:min(100% - 40px,430px);
  gap:12px;
  padding:32px 34px 28px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,251,255,.96));
  box-shadow:0 26px 80px rgba(24,35,58,.22);
}

.guidance-modal-icon{
  width:56px;
  height:56px;
  color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-strong));
  box-shadow:0 16px 34px rgba(var(--primary-rgb),.22);
}

.guidance-modal-overlay.is-danger .guidance-modal-icon{
  background:linear-gradient(135deg,var(--danger),#9f2732);
  box-shadow:0 16px 34px rgba(191,63,74,.22);
}

.guidance-modal-overlay.is-warning .guidance-modal-icon{
  background:linear-gradient(135deg,var(--warning),#8d5008);
  box-shadow:0 16px 34px rgba(168,102,19,.20);
}

.guidance-modal h2{
  margin:4px 0 0;
  color:var(--text);
  font-size:1.22rem;
  font-weight:800;
  letter-spacing:-.035em;
}

.guidance-modal p{
  max-width:340px;
  margin:0 0 6px;
  color:var(--text-soft);
  font-size:.94rem;
  line-height:1.6;
}

.guidance-modal .btn{
  min-height:42px;
  padding:0 22px;
  border-radius:14px;
  box-shadow:0 12px 26px rgba(var(--primary-rgb),.20);
}

.response-action-icons{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-width:132px;
}

.response-action-icons form{
  display:inline-flex;
  margin:0;
}

.action-icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:13px;
  color:var(--primary-deep);
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 22px rgba(39,68,112,.08), inset 0 1px 0 rgba(255,255,255,.85);
  transition:transform var(--transition), border-color var(--transition), background var(--transition), color var(--transition), box-shadow var(--transition);
}

.action-icon-btn:hover,
.action-icon-btn:focus-visible{
  transform:translateY(-1px);
  outline:0;
  border-color:rgba(var(--primary-rgb),.30);
  background:var(--primary-soft);
  box-shadow:0 12px 26px rgba(39,68,112,.12), var(--focus-ring);
}

.action-icon-approve{
  color:var(--success);
  border-color:rgba(32,135,90,.18);
  background:rgba(232,247,239,.82);
}

.action-icon-approve:hover,
.action-icon-approve:focus-visible{
  color:#fff;
  border-color:transparent;
  background:var(--success);
  box-shadow:0 12px 26px rgba(32,135,90,.18);
}

.action-icon-reject{
  color:var(--warning);
  border-color:rgba(168,102,19,.18);
  background:rgba(255,244,219,.84);
}

.action-icon-reject:hover,
.action-icon-reject:focus-visible{
  color:#fff;
  border-color:transparent;
  background:var(--warning);
  box-shadow:0 12px 26px rgba(168,102,19,.18);
}

.action-icon-delete{
  color:var(--danger);
  border-color:rgba(191,63,74,.18);
  background:rgba(255,240,241,.86);
}

.action-icon-delete:hover,
.action-icon-delete:focus-visible{
  color:#fff;
  border-color:transparent;
  background:var(--danger);
  box-shadow:0 12px 26px rgba(191,63,74,.18);
}

.card#form-responses .clean-table-wrap th:last-child,
.card#form-responses .clean-table-wrap td:last-child{
  width:150px;
  text-align:right!important;
}

.card#form-responses .clean-table-wrap tbody td{
  color:#3f4d64;
}

.card#form-responses .clean-table-wrap tbody td:first-child,
.card#form-responses .clean-table-wrap tbody td:nth-child(2),
.card#form-responses .clean-table-wrap tbody td:nth-child(3){
  color:var(--text);
  font-weight:700;
}

.card#form-responses .badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 12px;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.01em;
}

.card#form-responses .badge-success{color:var(--success);background:var(--success-bg);border-color:var(--success-border)}
.card#form-responses .badge-danger{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}
.card#form-responses .badge-warning{color:var(--warning);background:var(--warning-bg);border-color:var(--warning-border)}
.card#form-responses .badge-info{color:var(--info);background:var(--info-bg);border-color:var(--info-border)}
.card#form-responses .badge-default{color:var(--muted);background:var(--surface-muted);border-color:var(--border)}

@media (max-width:720px){
  .response-action-icons{
    width:100%;
    justify-content:flex-start;
  }

  .action-icon-btn{
    width:42px;
    height:42px;
  }
}

/* Profile polish and editable cards */
.role-profile-main-info{
  padding:26px 28px 34px;
}

.role-profile-summary{
  display:grid;
  gap:4px;
  max-width:290px;
  margin:0 auto;
  color:var(--text-soft);
  font-size:.94rem;
  line-height:1.45;
}

.role-profile-summary span{
  display:block;
}

.role-section-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.role-section-edit-btn{
  border:0;
  background:transparent;
  color:var(--primary);
  font:inherit;
  font-size:.9rem;
  font-weight:800;
  cursor:pointer;
  padding:6px 2px;
}

.role-section-edit-btn:hover{
  color:var(--primary-deep);
}

.role-section-actions{
  display:none;
  align-items:center;
  gap:8px;
}

.role-editable-card.is-editing .role-section-edit-btn{
  display:none;
}

.role-editable-card.is-editing .role-section-actions{
  display:flex;
}

.role-edit-input{
  display:none;
  width:100%;
  min-height:42px;
  padding:10px 12px;
  border:1px solid var(--border-strong);
  border-radius:14px;
  background:rgba(255,255,255,.86);
  color:var(--text);
  font:inherit;
  font-size:.95rem;
  font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}

.role-edit-input:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.62);
  box-shadow:var(--focus-ring);
}

.role-editable-card.is-editing .role-info-display{
  display:none;
}

.role-editable-card.is-editing .role-edit-input{
  display:block;
}

.role-profile-main-card .role-profile-stats,
.role-profile-main-card .role-profile-edit,
.role-security-card{
  display:none !important;
}

@media (max-width:640px){
  .role-section-head{
    flex-direction:column;
  }

  .role-section-tools,
  .role-section-actions{
    width:100%;
    justify-content:flex-start;
  }
}


/* Form intro cleanup and animated form icons */
.msf-form--direct .msf-intro-hero{
  min-height:auto;
  padding:clamp(22px,4vw,40px) clamp(18px,4vw,34px) 10px;
  background:linear-gradient(180deg,#f9fbff 0%,#eef5ff 100%);
}

.msf-form--direct .msf-intro{
  width:min(100%,760px);
  gap:0;
}

.msf-form--direct .msf-intro h2{
  font-size:clamp(1.9rem,3.8vw,2.85rem);
  margin-top:2px;
}

.msf-form--direct .msf-intro p{
  margin-top:14px;
  max-width:700px;
}

.msf-form--direct .msf-chip,
.msf-form--direct .msf-meta,
.msf-form--direct .msf-intro-actions,
.msf-form--direct .msf-begin{
  display:none !important;
}

.msf-form--direct .msf-questions-wrap{
  display:block;
  padding-bottom:8px;
  background:linear-gradient(180deg,#fbfdff 0%,#f7fbff 100%);
}

.msf-form--direct .msf-actions{
  display:flex;
}

.msf-intro-icon{
  position:relative;
  overflow:hidden;
}

.msf-intro-icon::after{
  content:'';
  position:absolute;
  inset:-35%;
  background:radial-gradient(circle,rgba(255,255,255,.72) 0%,rgba(255,255,255,0) 60%);
  opacity:.7;
  transform:translate(-38%,-30%);
  animation:msfIconGlow 3.8s ease-in-out infinite;
}

.msf-intro-svg{
  position:relative;
  z-index:1;
  animation:msfIconFloat 3s ease-in-out infinite;
  transform-origin:center;
}

.msf-intro-icon--appointment .msf-intro-svg{animation:msfIconBounce 3.2s ease-in-out infinite}
.msf-intro-icon--good_moral .msf-intro-svg{animation:msfIconShield 3.4s ease-in-out infinite}
.msf-intro-icon--consent .msf-intro-svg,
.msf-intro-icon--student_consent .msf-intro-svg,
.msf-intro-icon--evaluation .msf-intro-svg{animation:msfIconPulse 3s ease-in-out infinite}
.msf-intro-icon--inventory .msf-intro-svg{animation:msfIconFloat 3s ease-in-out infinite}
.msf-intro-icon--student_exit .msf-intro-svg,
.msf-intro-icon--referral .msf-intro-svg{animation:msfIconSlide 3.2s ease-in-out infinite}
.msf-intro-icon--employee_exit .msf-intro-svg{animation:msfIconPulse 3.4s ease-in-out infinite}

@keyframes msfIconGlow{
  0%,100%{opacity:.45;transform:translate(-40%,-32%) scale(.9)}
  50%{opacity:.9;transform:translate(-10%,-6%) scale(1.08)}
}
@keyframes msfIconFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
@keyframes msfIconBounce{
  0%,100%{transform:translateY(0) scale(1)}
  18%{transform:translateY(-4px) scale(1.02)}
  36%{transform:translateY(0) scale(1)}
  54%{transform:translateY(-2px) scale(1.01)}
}
@keyframes msfIconShield{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.07)}
}
@keyframes msfIconPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.08)}
}
@keyframes msfIconTilt{
  0%,100%{transform:rotate(0deg)}
  25%{transform:rotate(-6deg)}
  75%{transform:rotate(6deg)}
}
@keyframes msfIconSlide{
  0%,100%{transform:translateX(0)}
  50%{transform:translateX(3px)}
}

@media (max-width: 768px){
  .msf-form--direct .msf-intro-hero{
    padding:24px 16px 8px;
  }

  .msf-form--direct .msf-intro h2{
    font-size:clamp(1.7rem,8vw,2.3rem);
  }
}


/* Clean intro with Start button restored */
.msf-form--clean-intro .msf-chip,
.msf-form--clean-intro .msf-meta{
  display:none !important;
}

.msf-form--clean-intro .msf-intro-actions{
  display:flex;
}

.msf-input[readonly],
.msf-input[data-prefill-locked='1'],
select.msf-input[data-prefill-locked='1']{
  cursor:not-allowed;
  color:var(--text);
  background:linear-gradient(180deg,rgba(245,249,255,.94),rgba(235,243,255,.88));
  border-color:rgba(var(--primary-rgb),.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
}

.msf-question.is-prefilled .msf-question-label::after{
  content:'Locked';
  margin-left:8px;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(var(--primary-rgb),.08);
  color:var(--primary-deep);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.msf-prefill-hint{
  color:var(--text-soft);
}


/* Form intro text-only update */
.msf-form--clean-intro .msf-intro-icon{
  display:none !important;
}

.msf-form--clean-intro .msf-intro-hero{
  padding-top:clamp(38px,6vw,72px);
}

.msf-form--clean-intro .msf-intro p{
  white-space:pre-line;
}

.good-moral-reminder-card{
  width:min(100%,780px);
  padding:42px clamp(22px,4vw,44px);
  text-align:center;
  background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(239,247,255,.92));
}

.good-moral-reminder-card h2{
  margin:0 0 12px;
  color:var(--text);
  font-size:clamp(1.55rem,3vw,2.15rem);
  letter-spacing:-.035em;
}

.good-moral-reminder-card p{
  max-width:620px;
  margin:0 auto 24px;
  color:var(--text-soft);
  line-height:1.7;
  font-weight:600;
}


/* Register / Sign Up */
.auth-register-wrap{
  align-items:start;
  place-items:center;
  padding:34px 18px;
}

.register-card{
  width:min(980px,100%);
  padding:clamp(22px,3vw,34px);
}

.register-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}

.register-form{
  gap:18px;
}

.role-select-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.role-select-card{
  position:relative;
  display:grid;
  gap:7px;
  min-height:132px;
  padding:16px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:20px;
  color:var(--text);
  background:rgba(255,255,255,.78);
  box-shadow:0 12px 34px rgba(37,79,145,.08);
  cursor:pointer;
  transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease,background 180ms ease;
}

.role-select-card:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--primary-rgb),.3);
  box-shadow:0 18px 40px rgba(37,79,145,.12);
}

.role-select-card input{
  position:absolute;
  inset:14px 14px auto auto;
  width:18px;
  height:18px;
  accent-color:var(--primary);
}

.role-select-card:has(input:checked){
  border-color:rgba(var(--primary-rgb),.5);
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(232,242,255,.9));
  box-shadow:0 18px 44px rgba(37,79,145,.16);
}

.role-select-icon{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  color:var(--primary-deep);
  background:var(--primary-soft);
}

.role-select-card strong{
  font-size:.96rem;
  color:var(--text);
}

.role-select-card small{
  max-width:210px;
  color:var(--text-soft);
  line-height:1.45;
}

.register-section{
  display:grid;
  gap:14px;
  padding:16px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:20px;
  background:rgba(248,251,255,.72);
}

.register-section[hidden]{
  display:none !important;
}

.register-grid{
  display:grid;
  gap:14px;
}

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

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

.field-note{
  color:var(--muted);
  font-size:.78rem;
  line-height:1.35;
}

.auth-switch{
  margin-top:18px;
  padding:14px 16px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:16px;
  color:var(--text-soft);
  background:rgba(255,255,255,.72);
  text-align:center;
  font-size:.92rem;
}

.auth-switch a{
  color:var(--primary-deep);
  font-weight:800;
  text-decoration:none;
}

.auth-switch a:hover{
  text-decoration:underline;
}

@media (max-width: 860px){
  .role-select-grid,
  .register-grid.two,
  .register-grid.three{
    grid-template-columns:1fr;
  }

  .role-select-card{
    min-height:auto;
  }
}


/* Auth portal redesign */
.auth-portal{
  min-height:100vh;
  background:#eef3fb;
}

.auth-sitebar{
  position:relative;
  z-index:3;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(var(--primary-rgb),.08);
  box-shadow:0 10px 24px rgba(18,42,82,.05);
}

.auth-sitebar-inner{
  width:min(1240px,calc(100% - 32px));
  min-height:82px;
  margin:0 auto;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
}

.auth-sitebrand{
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
}

.auth-sitebrand img{
  width:76px;
  height:48px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
}

.auth-sitebrand-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.auth-sitebrand-text strong{
  color:var(--primary-deep);
  font-size:1rem;
  line-height:1.15;
}

.auth-sitebrand-text span{
  color:var(--text-soft);
  font-size:.82rem;
}

.auth-site-links{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}

.auth-site-links a{
  padding:8px 10px;
  color:var(--text);
  text-decoration:none;
  font-weight:700;
  border-radius:12px;
  transition:background var(--transition), color var(--transition);
}

.auth-site-links a:hover{
  color:var(--primary-deep);
  background:rgba(var(--primary-rgb),.06);
}

.auth-site-cta{
  min-width:102px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 20px;
  border-radius:12px;
  border:1px solid var(--primary);
  font-weight:800;
  letter-spacing:.01em;
  text-decoration:none;
  transition:transform var(--transition),box-shadow var(--transition),background var(--transition),color var(--transition);
}

.auth-site-cta:hover{
  transform:translateY(-1px);
}

.auth-site-cta-solid{
  color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  box-shadow:0 14px 30px rgba(var(--primary-strong-rgb),.16);
}

.auth-site-cta-outline{
  color:var(--primary-deep);
  background:#fff;
}

.auth-stage{
  position:relative;
  min-height:calc(100vh - 82px);
  padding:18px 16px 56px;
  overflow:hidden;
}

.auth-stage-band{
  position:absolute;
  inset:0 0 auto 0;
  height:clamp(250px,40vh,420px);
  background:linear-gradient(180deg,var(--primary-deep) 0%, var(--primary) 100%);
}

.auth-stage::before,
.auth-stage::after{
  content:"";
  position:absolute;
  border-radius:999px;
  filter:blur(6px);
  opacity:.18;
  pointer-events:none;
}

.auth-stage::before{
  top:120px;
  left:-90px;
  width:240px;
  height:240px;
  background:#ffffff;
}

.auth-stage::after{
  right:-80px;
  bottom:120px;
  width:260px;
  height:260px;
  background:#7fb0ff;
}

.auth-panel{
  position:relative;
  z-index:1;
  width:min(660px,100%);
  margin:clamp(48px,10vh,90px) auto 0;
  padding:clamp(28px,4vw,42px);
  border-radius:38px;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(var(--primary-rgb),.08);
  box-shadow:0 20px 50px rgba(12,36,76,.16), 0 4px 10px rgba(12,36,76,.06);
}

.auth-panel-login{
  width:min(720px,100%);
}

.auth-panel-register{
  width:min(760px,100%);
}

.auth-panel-header{
  margin-bottom:26px;
}

.auth-panel-header-centered{
  text-align:center;
}

.auth-panel-header h1{
  margin:0;
  color:var(--primary-deep);
  font-size:clamp(2rem,4vw,2.9rem);
  line-height:1.02;
  letter-spacing:-.05em;
}

.auth-panel-header p{
  margin:10px 0 0;
  color:var(--text-soft);
  font-size:1.02rem;
}

.auth-form-portal{
  gap:18px;
}

.auth-field-shell{
  gap:8px;
}

.auth-field-shell label{
  color:var(--text);
  font-size:1rem;
  font-weight:700;
}

.auth-field-shell input,
.auth-field-shell select,
.auth-field-shell textarea{
  min-height:56px;
  padding:15px 18px;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:14px;
  background:#fff;
  box-shadow:none;
}

.auth-field-shell input::placeholder{
  color:#8b9ab5;
}

.password-field-wrap{
  position:relative;
}

.password-field-wrap input{
  padding-right:50px;
}

.password-toggle{
  position:absolute;
  top:50%;
  right:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  padding:0;
  border:0;
  color:#7183a5;
  background:transparent;
  transform:translateY(-50%);
  cursor:pointer;
}

.password-toggle-icon--shown{display:none}
.password-toggle.is-active .password-toggle-icon--hidden{display:none}
.password-toggle.is-active .password-toggle-icon--shown{display:block}

.auth-submit-btn{
  min-height:56px;
  margin-top:4px;
  border-radius:14px;
  font-size:1.04rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.auth-switch-plain{
  margin-top:12px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

.register-role-pills{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.register-role-pill{
  position:relative;
  display:flex;
}

.register-role-pill input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}

.register-role-pill span{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:12px 14px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:14px;
  background:#f6f9ff;
  color:var(--primary-deep);
  font-weight:800;
  text-align:center;
  transition:background var(--transition),border-color var(--transition),box-shadow var(--transition),color var(--transition),transform var(--transition);
}

.register-role-pill:hover span{
  transform:translateY(-1px);
}

.register-role-pill input:checked + span{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  box-shadow:0 14px 24px rgba(var(--primary-strong-rgb),.18);
}

.register-section-clean{
  padding:0;
  border:0;
  background:transparent;
}

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

.field-note{
  color:var(--text-soft);
  font-size:.8rem;
}

.auth-form-portal .register-section[hidden]{
  display:none !important;
}

@media (max-width: 980px){
  .auth-sitebar-inner{
    grid-template-columns:1fr;
    justify-items:center;
    padding:14px 0;
    gap:12px;
  }

  .auth-sitebrand{
    justify-content:center;
  }
}

@media (max-width: 768px){
  .auth-stage{
    padding:12px 12px 28px;
  }

  .auth-stage-band{
    height:220px;
  }

  .auth-panel{
    margin-top:28px;
    padding:24px 18px;
    border-radius:28px;
  }

  .register-role-pills,
  .register-grid.two,
  .register-grid.three,
  .register-grid-two-up{
    grid-template-columns:1fr;
  }

  .auth-site-links{
    gap:8px;
  }

  .auth-site-links a{
    font-size:.93rem;
  }
}

/* Unified stats card refresh: uses the former form banner color treatment */
.template-stats{
  align-items:stretch;
}

.template-stat{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:var(--radius-lg);
  background:
    radial-gradient(circle at 92% 8%,rgba(var(--primary-rgb),.16),transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(234,243,255,.88));
  box-shadow:0 18px 44px rgba(37,79,145,.10);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}

.template-stat::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,0) 42%);
  pointer-events:none;
}

.template-stat > *{
  position:relative;
  z-index:1;
}

.template-stat .icon-wrap{
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  color:var(--primary-deep);
  background:rgba(255,255,255,.7);
  border:1px solid rgba(var(--primary-rgb),.10);
  box-shadow:0 10px 22px rgba(37,79,145,.08);
}

.template-stat .label{
  color:#7888a4;
  letter-spacing:.055em;
}

.template-stat .value{
  color:var(--text);
}

.template-stat .sub{
  color:var(--text-soft);
}

.form-page-stats{
  margin:0 0 18px;
}

.form-summary-stat{
  min-height:128px;
}

@media (max-width: 1180px){
  .form-page-stats,
  .template-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .form-page-stats,
  .template-stats{
    grid-template-columns:1fr;
  }

  .template-stat{
    min-height:124px;
  }
}


/* Guidance appointment face-to-face workflow */
.face-to-face-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  margin-top:6px;
  padding:6px 10px;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:999px;
  color:var(--primary-deep);
  background:rgba(var(--primary-rgb),.08);
  font-size:.76rem;
  font-weight:800;
}

.appointment-action-panel{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:10px;
  min-width:240px;
}

.reject-mini-form{
  display:flex;
  align-items:center;
  gap:8px;
}

.mini-reason-input{
  width:140px;
  min-height:38px;
  padding:8px 10px;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:12px;
  color:var(--text);
  background:#fff;
}

.btn-session{
  min-height:38px;
  padding:9px 14px;
  border-radius:13px;
  font-size:.84rem;
  white-space:nowrap;
}

.session-box{
  width:min(100%,320px);
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(235,245,255,.92));
}

.session-timer{
  width:max-content;
  padding:8px 12px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-deep));
  font-size:.9rem;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow:0 10px 22px rgba(var(--primary-strong-rgb),.18);
}

.session-box textarea{
  width:100%;
  min-height:88px;
  padding:11px 12px;
  border:1px solid rgba(var(--primary-rgb),.16);
  border-radius:14px;
  resize:vertical;
}

.session-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.btn-sm{
  min-height:36px;
  padding:8px 12px;
  border-radius:12px;
  font-size:.82rem;
}

.session-note-preview{
  margin-top:10px;
  padding:10px;
  border-radius:12px;
  background:rgba(var(--primary-rgb),.06);
}

.consent-ready-card{
  margin-bottom:var(--card-gap);
  border-color:rgba(var(--primary-rgb),.14);
  background:linear-gradient(135deg,#f8fbff 0%,#edf6ff 100%);
}

.consent-sign-card{
  max-width:920px;
  margin:0 auto;
}

.consent-sign-card h2{
  margin:8px 0 6px;
  color:var(--text);
  font-size:clamp(1.5rem,2.4vw,2rem);
}

.consent-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:18px 0;
}

.consent-summary-grid > div{
  padding:14px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:16px;
  background:linear-gradient(135deg,#f8fbff 0%,#edf6ff 100%);
}

.consent-summary-grid span{
  display:block;
  color:var(--text-soft);
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
}

.consent-summary-grid strong{
  display:block;
  margin-top:5px;
  color:var(--text);
}

.consent-statement{
  margin:18px 0;
  padding:18px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:18px;
  color:var(--text-soft);
  background:#fff;
  line-height:1.7;
}

.consent-sign-form{
  display:grid;
  gap:14px;
}

.consent-check{
  align-items:flex-start;
  line-height:1.5;
}

@media (max-width: 900px){
  .consent-summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .consent-summary-grid{
    grid-template-columns:1fr;
  }
  .appointment-action-panel,
  .response-action-icons,
  .reject-mini-form{
    justify-content:flex-start;
  }
  .mini-reason-input{
    width:100%;
  }
}



/* Dedicated Guidance Appointment Session page */
.session-page-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:22px;
  align-items:start;
}

.appointment-session-card{
  border:1px solid rgba(var(--primary-rgb),.13);
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(235,245,255,.88));
  box-shadow:0 24px 70px rgba(37,79,145,.11);
}

.session-main-card{
  padding:28px;
}

.session-page-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding-bottom:22px;
  border-bottom:1px solid rgba(var(--primary-rgb),.12);
}

.session-page-head h2{
  margin:12px 0 8px;
  color:var(--text);
  font-size:clamp(1.75rem,3vw,2.35rem);
  line-height:1.08;
  letter-spacing:-.045em;
}

.session-page-head p{
  max-width:720px;
  margin:0;
  color:var(--text-soft);
  line-height:1.65;
}

.session-head-status{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}

.session-timer-large{
  min-width:126px;
  justify-content:center;
  text-align:center;
  font-size:1rem;
}

.session-timer-large.is-completed{
  color:var(--primary-deep);
  background:rgba(var(--primary-rgb),.08);
  border:1px solid rgba(var(--primary-rgb),.14);
  box-shadow:none;
}

.session-info-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:22px 0;
}

.session-info-card{
  padding:16px;
  border:1px solid rgba(var(--primary-rgb),.13);
  border-radius:18px;
  background:rgba(255,255,255,.76);
}

.session-info-card span,
.session-detail-list span{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:.74rem;
  font-weight:900;
  letter-spacing:.045em;
  text-transform:uppercase;
}

.session-info-card strong,
.session-detail-list strong{
  color:var(--text);
  font-size:.98rem;
  line-height:1.4;
}

.session-notes-form{
  display:grid;
  gap:12px;
}

.session-notes-form label{
  color:var(--text);
  font-weight:900;
}

.session-notes-form textarea{
  width:100%;
  min-height:260px;
  padding:16px;
  border:1px solid rgba(var(--primary-rgb),.15);
  border-radius:20px;
  color:var(--text);
  background:rgba(255,255,255,.86);
  resize:vertical;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}

.session-notes-form textarea:focus{
  outline:0;
  border-color:rgba(var(--primary-rgb),.55);
  box-shadow:var(--focus-ring);
}

.session-notes-form textarea[readonly]{
  color:var(--text-soft);
  background:rgba(245,249,255,.75);
}

.session-note-lock{
  margin:0;
  color:var(--text-soft);
  font-size:.9rem;
}

.session-page-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
}

.session-side-stack{
  display:grid;
  gap:18px;
  position:sticky;
  top:104px;
}

.session-card-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  color:var(--primary-deep);
  font-weight:900;
}

.session-detail-list{
  display:grid;
  gap:14px;
}

.session-detail-list > div{
  padding:13px 14px;
  border:1px solid rgba(var(--primary-rgb),.10);
  border-radius:16px;
  background:rgba(255,255,255,.68);
}

.session-box-compact{
  width:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}

@media (max-width:1100px){
  .session-page-grid{
    grid-template-columns:1fr;
  }
  .session-side-stack{
    position:static;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .session-page-head,
  .session-head-status{
    align-items:flex-start;
  }
  .session-page-head{
    flex-direction:column;
  }
  .session-info-grid,
  .session-side-stack{
    grid-template-columns:1fr;
  }
  .session-main-card{
    padding:20px;
  }
  .session-page-actions{
    justify-content:stretch;
  }
  .session-page-actions .btn{
    width:100%;
  }
}


/* Appointment Session page final polish / cache-refresh safe overrides */
.session-page-grid{
  width:100%;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(320px,380px) !important;
  gap:24px !important;
  align-items:start !important;
}

.appointment-session-card.card,
.appointment-session-card{
  border:1px solid rgba(var(--primary-rgb),.13) !important;
  border-radius:28px !important;
  background:linear-gradient(135deg,#ffffff 0%,#f3f8ff 100%) !important;
  box-shadow:0 24px 70px rgba(37,79,145,.12) !important;
}

.session-main-card{
  padding:clamp(22px,3vw,34px) !important;
}

.session-page-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:20px !important;
  padding-bottom:22px !important;
  border-bottom:1px solid rgba(var(--primary-rgb),.12) !important;
}

.session-page-head h2{
  margin:10px 0 8px !important;
  color:var(--text) !important;
  font-size:clamp(1.75rem,3vw,2.35rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.045em !important;
}

.session-page-head p{
  max-width:720px !important;
  margin:0 !important;
  color:var(--text-soft) !important;
  line-height:1.65 !important;
}

.session-head-status{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-end !important;
  gap:10px !important;
}

.session-timer.session-timer-large{
  min-width:138px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:12px 18px !important;
  border-radius:999px !important;
  color:#fff !important;
  background:linear-gradient(135deg,var(--primary),var(--primary-deep)) !important;
  font-size:1.05rem !important;
  font-weight:900 !important;
  letter-spacing:.05em !important;
  box-shadow:0 14px 26px rgba(var(--primary-strong-rgb),.2) !important;
}

.session-timer.session-timer-large.is-completed{
  color:var(--primary-deep) !important;
  background:rgba(var(--primary-rgb),.08) !important;
  border:1px solid rgba(var(--primary-rgb),.14) !important;
  box-shadow:none !important;
}

.session-info-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  margin:22px 0 !important;
}

.session-info-card{
  padding:16px !important;
  border:1px solid rgba(var(--primary-rgb),.13) !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.78) !important;
}

.session-info-card span,
.session-detail-list span{
  display:block !important;
  margin-bottom:6px !important;
  color:var(--muted) !important;
  font-size:.74rem !important;
  font-weight:900 !important;
  letter-spacing:.045em !important;
  text-transform:uppercase !important;
}

.session-info-card strong,
.session-detail-list strong{
  display:block !important;
  color:var(--text) !important;
  font-size:.98rem !important;
  line-height:1.4 !important;
}

.session-notes-form{
  display:grid !important;
  gap:12px !important;
}

.session-notes-form label{
  color:var(--text) !important;
  font-weight:900 !important;
}

.session-notes-form textarea{
  width:100% !important;
  min-height:300px !important;
  padding:16px !important;
  border:1px solid rgba(var(--primary-rgb),.15) !important;
  border-radius:20px !important;
  color:var(--text) !important;
  background:rgba(255,255,255,.9) !important;
  resize:vertical !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85) !important;
}

.session-notes-form textarea:focus{
  outline:0 !important;
  border-color:rgba(var(--primary-rgb),.55) !important;
  box-shadow:var(--focus-ring) !important;
}

.session-page-actions{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  margin-top:8px !important;
}

.session-side-stack{
  display:grid !important;
  gap:18px !important;
  position:sticky !important;
  top:104px !important;
}

.session-side-stack .appointment-session-card{
  padding:22px !important;
}

.session-card-title{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-bottom:16px !important;
  color:var(--primary-deep) !important;
  font-weight:900 !important;
}

.session-detail-list{
  display:grid !important;
  gap:14px !important;
}

.session-detail-list > div{
  padding:13px 14px !important;
  border:1px solid rgba(var(--primary-rgb),.10) !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.72) !important;
}

@media (max-width:1100px){
  .session-page-grid{
    grid-template-columns:1fr !important;
  }
  .session-side-stack{
    position:static !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .session-page-head,
  .session-head-status{
    align-items:flex-start !important;
  }
  .session-page-head{
    flex-direction:column !important;
  }
  .session-info-grid,
  .session-side-stack{
    grid-template-columns:1fr !important;
  }
  .session-main-card{
    padding:20px !important;
  }
  .session-page-actions{
    justify-content:stretch !important;
  }
  .session-page-actions .btn{
    width:100% !important;
  }
}

/* Official-style Faculty Referral Form */
.referral-paper-shell {
  max-width: 1180px;
  margin: 0 auto 32px;
}

.referral-paper-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.referral-paper-head .eyebrow {
  display: inline-block;
  margin-bottom: 6px;
  color: var(--muted, #667085);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.referral-paper-head h2 {
  margin: 0 0 6px;
  color: var(--text, #1f2937);
  font-size: clamp(1.55rem, 2.2vw, 2rem);
}

.referral-paper-head p {
  margin: 0;
  color: var(--muted, #667085);
}

.referral-paper-form {
  background: #ffffff;
  border: 1px solid rgba(118, 147, 208, 0.22);
  border-radius: 22px;
  box-shadow: 0 18px 45px rgba(35, 49, 110, 0.08);
  padding: clamp(16px, 2.6vw, 28px);
  overflow: hidden;
}

.referral-form-table {
  border: 2px solid #202020;
  background: #ffffff;
  color: #1b1b1b;
  font-size: 0.98rem;
}

.ref-row {
  display: grid;
  border-bottom: 1.6px solid #202020;
}

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

.ref-row-top {
  grid-template-columns: 1fr 1.5fr 1.9fr;
}

.ref-row-student {
  grid-template-columns: 2fr 1.25fr 1fr 0.85fr 0.65fr;
}

.ref-row-bottom {
  grid-template-columns: 2fr 1fr;
}

.ref-cell {
  min-width: 0;
  padding: 10px 12px;
  border-right: 1.6px solid #202020;
}

.ref-cell:last-child,
.ref-cell.full {
  border-right: 0;
}

.ref-cell.full {
  grid-column: 1 / -1;
}

.ref-cell-school {
  display: grid;
  gap: 8px;
  padding: 0;
}

.ref-cell-school label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 7px 12px;
  border-bottom: 1.6px solid #202020;
  font-weight: 700;
}

.ref-cell-school label:last-child {
  border-bottom: 0;
}

.ref-cell-school label.stacked {
  display: grid;
  align-items: start;
  gap: 4px;
}

.ref-cell-school input,
.ref-field-cell input,
.ref-field-cell select,
.ref-cell-checks input[type="text"] {
  width: 100%;
  min-width: 0;
}

.ref-cell-school input {
  flex: 1;
}

.ref-cell input[type="text"],
.ref-cell input[type="date"],
.ref-cell select,
.ref-cell textarea {
  border: 0;
  border-bottom: 1.5px solid rgba(32, 32, 32, 0.75);
  border-radius: 0;
  background: transparent;
  color: #111827;
  font: inherit;
  outline: none;
  padding: 5px 4px;
}

.ref-cell select {
  border: 1px solid rgba(32, 32, 32, 0.45);
  border-radius: 8px;
  padding: 8px 9px;
  background: #fff;
}

.ref-cell textarea {
  display: block;
  width: 100%;
  min-height: 78px;
  resize: vertical;
  border-bottom: 0;
  padding: 8px 4px;
}

.ref-cell input:focus,
.ref-cell select:focus,
.ref-cell textarea:focus {
  box-shadow: 0 2px 0 #7693D0;
}

.ref-cell input[readonly],
.ref-cell textarea[readonly] {
  color: #374151;
}

.ref-field-cell label,
.ref-section-label {
  display: block;
  margin-bottom: 6px;
  font-weight: 800;
}

.ref-field-cell.small input {
  text-align: center;
}

.ref-section-label span {
  font-weight: 700;
}

.required-mark {
  color: #b42318;
}

.ref-cell-checks strong {
  display: block;
  margin-bottom: 14px;
}

.ref-inline-options,
.ref-spread-options,
.ref-grid-options {
  display: grid;
  gap: 12px;
}

.ref-inline-options {
  grid-template-columns: repeat(3, minmax(90px, 1fr));
}

.ref-spread-options {
  grid-template-columns: repeat(4, minmax(130px, 1fr));
}

.ref-grid-options.three-cols {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.ref-inline-options label,
.ref-spread-options label,
.ref-grid-options label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 30px;
  font-weight: 700;
}

.ref-cell input[type="checkbox"],
.ref-cell input[type="radio"] {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  accent-color: #7693D0;
}

.ref-grid-options label.with-line {
  gap: 8px;
}

.ref-grid-options label.with-line input[type="text"],
.ref-grid-options label.with-line input[type="date"] {
  flex: 1;
  min-width: 90px;
}

.ref-row-textarea .ref-cell {
  padding-bottom: 4px;
}

.ref-office-use textarea {
  min-height: 64px;
}

.ref-feedback-date {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.referral-paper-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

.referral-review-details {
  margin-top: 8px;
}

.referral-review-details summary {
  cursor: pointer;
  color: #4365ad;
  font-weight: 700;
}

.referral-review-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(160px, 1fr));
  gap: 10px 14px;
  margin: 10px 0 0;
  padding: 12px;
  border: 1px solid rgba(118, 147, 208, 0.22);
  border-radius: 14px;
  background: #F8FAFF;
}

.referral-review-grid div {
  min-width: 0;
}

.referral-review-grid div.wide {
  grid-column: 1 / -1;
}

.referral-review-grid dt {
  color: #667085;
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.referral-review-grid dd {
  margin: 3px 0 0;
  color: #1f2937;
  line-height: 1.45;
}

@media (max-width: 980px) {
  .ref-row-top,
  .ref-row-student,
  .ref-row-bottom {
    grid-template-columns: 1fr;
  }

  .ref-cell {
    border-right: 0;
    border-bottom: 1.6px solid #202020;
  }

  .ref-row .ref-cell:last-child {
    border-bottom: 0;
  }

  .ref-inline-options,
  .ref-spread-options,
  .ref-grid-options.three-cols,
  .referral-review-grid {
    grid-template-columns: 1fr;
  }
}

@media print {
  .referral-paper-shell {
    max-width: none;
    margin: 0;
  }

  .referral-paper-head,
  .referral-paper-actions,
  .sidebar,
  .topbar,
  .app-topbar {
    display: none !important;
  }

  .referral-paper-form {
    border: 0;
    box-shadow: none;
    padding: 0;
  }

  .referral-form-table {
    font-size: 11px;
  }
}

/* Student Consent Form - Guidance and Counseling Services format */
.consent-form-document-card{
  max-width:980px;
}

.consent-document{
  margin:18px 0 20px;
  padding:22px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:20px;
  background:#fff;
}

.consent-section-text + .consent-section-text{
  margin-top:22px;
}

.consent-section-text h3{
  margin:0 0 12px;
  color:var(--text);
  font-size:1rem;
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.consent-section-text p,
.consent-section-text li{
  color:var(--text-soft);
  line-height:1.75;
  font-size:.95rem;
}

.consent-section-text ul{
  margin:10px 0 0 18px;
  padding:0;
}

.consent-section-text li + li{
  margin-top:10px;
}

.consent-question-form{
  gap:16px;
}

.consent-question-card{
  display:grid;
  gap:10px;
  padding:18px;
  border:1px solid rgba(var(--primary-rgb),.12);
  border-radius:18px;
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%);
}

.consent-question-title{
  color:var(--text);
  font-weight:900;
}

.consent-question-title span{
  color:#dc2626;
}

.consent-example{
  margin:0;
  color:var(--text-soft);
  font-size:.88rem;
}

.consent-choice-list{
  display:grid;
  gap:10px;
}

.consent-choice-list label{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--text);
  font-weight:700;
}

.consent-choice-list input[type="radio"]{
  width:16px;
  height:16px;
  accent-color:var(--primary);
}

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

.consent-other-input{
  margin-top:4px;
}

@media (max-width: 640px){
  .consent-document,
  .consent-question-card{
    padding:16px;
  }
  .consent-grade-list{
    grid-template-columns:1fr;
  }
}

/* Conditional Microsoft Forms-style sections */
.msf-section.is-conditional-hidden,
.msf-section-pill.is-conditional-hidden {
  display: none !important;
}


/* Applied Landing Page from provided layout */
.landing{
  --bg:#F4F5FB;
  --navy:#23316E;
  --navy-hover:#23316E;
  --yellow:#F7C94B;
  --white:#ffffff;
  min-height:100vh;
  background:#F4F5FB;
}

.landing .navbar{
  background:#F4F5FB;
  width:100%;
  padding:20px;
  height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:999;
  border-bottom:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.landing .brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.landing .brand-texts{
  display:flex;
  flex-direction:column;
  line-height:1.35;
}

.landing .brand-name{
  font-size:1.3rem;
  font-weight:800;
  color:#23316E;
  letter-spacing:-0.01em;
}

.landing .brand-sub{
  font-size:0.99rem;
  font-weight:600;
  color:#23316E;
}

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

.landing .nav-faqs{
  font-size:0.93rem;
  font-weight:600;
  color:#23316E;
  text-decoration:none;
  transition:opacity .15s;
}

.landing .nav-faqs:hover{opacity:.6;}

.landing .btn-signup{
  background:#fff;
  color:#23316E;
  border:1.5px solid rgba(35,49,110,0.22);
  border-radius:10px;
  padding:11px 28px;
  font-family:'Poppins',sans-serif;
  font-size:0.93rem;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
  transition:background .18s,transform .15s,border-color .18s;
  min-height:auto;
  box-shadow:none;
}

.landing .btn-signup:hover{
  background:#eef2ff;
  border-color:#23316E;
  transform:translateY(-1px);
}

.landing .btn-login{
  background:#F7C94B;
  color:#1a1f3c;
  border:none;
  border-radius:10px;
  padding:11px 32px;
  font-family:'Poppins',sans-serif;
  font-size:0.93rem;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
  transition:background .18s,transform .15s;
  min-height:auto;
  box-shadow:none;
}

.landing .btn-login:hover{
  background:#e8b800;
  transform:translateY(-1px);
}


.landing.landing-nav-shell{
  min-height:auto;
  background:#F4F5FB;
}

.landing.landing-nav-shell .navbar{
  position:sticky;
  top:0;
}

.landing .hero-section{
  background:#F4F5FB;
  padding:0;
}

.landing .hero-card{
  position:relative;
  overflow:hidden;
  height:400px;
  min-height:0;
  display:flex;
  align-items:flex-end;
  border-radius:0;
  box-shadow:none;
}

.landing .hero-img{
  position:absolute;
  inset:-50px 0;
  background:url('https://images.unsplash.com/photo-1523240795612-9a054b0db644?w=1400&q=85&auto=format&fit=crop') center/cover no-repeat;
  will-change:transform;
  transition:none;
}

.landing .hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(13,20,65,0.96) 0%,rgba(13,20,65,0.50) 38%,rgba(13,20,65,0) 68%);
}

.landing .hero-content{
  position:relative;
  z-index:2;
  padding:0 52px 48px;
  max-width:800px;
  min-height:0;
  display:block;
}

.landing .hero-text{
  font-size:1.3rem;
  font-weight:600;
  color:#fff;
  line-height:1.65;
  margin-bottom:28px;
  max-width:none;
}

.landing .btn-started{
  display:inline-block;
  background:#F7C94B;
  color:#1a1f3c;
  border:none;
  border-radius:10px;
  padding:12px 30px;
  font-family:'Poppins',sans-serif;
  font-size:0.92rem;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
  transition:background .18s,transform .15s;
  min-height:auto;
  box-shadow:none;
}

.landing .btn-started:hover{
  background:#e8b800;
  transform:translateY(-2px);
}

.landing .featured-section{
  background:#F4F5FB;
  padding:40px 15px;
}

.landing .feat-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:28px;
  text-align:left;
}

.landing .feat-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:1.5rem;
  font-weight:800;
  color:#23316E;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.landing .fb-link{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:0;
  font-size:1.3rem;
  font-weight:800;
  color:#23316E;
  text-decoration:none;
  transition:opacity .15s;
}

.landing .fb-link:hover{opacity:.7;}

.landing .fb-circle{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:auto;
  height:auto;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.landing .feat-cards{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:15px;
  align-items:center;
  overflow:visible;
}

.landing .feat-card{
  position:relative;
  border-radius:10px;
  overflow:hidden;
  cursor:pointer;
  height:300px;
  min-height:0;
  transform:scale(1);
  transform-origin:center center;
  transition:transform .42s cubic-bezier(.25,.46,.45,.94),box-shadow .42s ease;
  z-index:1;
  box-shadow:none;
}

.landing .feat-card:hover{
  transform:scale(1.18);
  z-index:10;
  box-shadow:0 20px 60px rgba(0,0,0,0.55);
}

.landing .feat-card-img{
  position:absolute;
  top:-30px;
  bottom:-30px;
  left:0;
  right:0;
  background-size:cover;
  background-position:center;
  transition:transform .55s cubic-bezier(.25,.46,.45,.94);
  will-change:transform;
}

.landing .feat-card:hover .feat-card-img{transform:scale(1.08);}

.landing .feat-card-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(13,20,65,0.96) 0%,rgba(13,20,65,0.50) 38%,rgba(13,20,65,0) 68%);
  transition:background .4s;
}

.landing .feat-card:hover .feat-card-overlay{
  background:linear-gradient(to top,rgba(13,20,65,0.97) 0%,rgba(13,20,65,0.60) 44%,rgba(13,20,65,0) 68%);
}

.landing .feat-card-body{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  height:auto;
  display:block;
  padding:20px 20px 26px;
  z-index:2;
}

.landing .feat-card-title{
  font-size:1rem;
  font-weight:700;
  color:#fff;
  margin-bottom:6px;
  line-height:1.3;
}

.landing .feat-card-desc{
  font-size:0.77rem;
  color:rgba(255,255,255,0.85);
  line-height:1.6;
}

.landing .resources-section{
  background:#F4F5FB;
  padding:20px 150px 50px;
  width:100%;
}

.landing .res-top{
  text-align:center;
  margin-bottom:40px;
}

.landing .res-title{
  font-size:1.75rem;
  font-weight:800;
  color:#23316E;
  margin-bottom:14px;
}

.landing .res-sub{
  font-size:0.88rem;
  color:#23316E;
  line-height:1.75;
  max-width:none;
  margin:0;
}

.landing .res-row{
  display:flex;
  gap:24px;
  margin-bottom:44px;
  margin-top:0;
}

.landing .res-row:last-child{margin-bottom:0;}

.landing .res-card{
  background:#23316E;
  border:2.5px solid #23316E;
  border-radius:32px;
  padding:52px 44px 36px;
  position:relative;
  text-align:center;
  min-height:160px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 8px 32px rgba(0,0,0,0.35),0 2px 8px rgba(0,0,0,0.2);
  transition:transform .2s ease,box-shadow .2s ease;
}

.landing .res-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 48px rgba(0,0,0,0.45),0 4px 16px rgba(0,0,0,0.25);
}

.landing .res-row-1 .res-card:nth-child(1){flex:1.45;}
.landing .res-row-1 .res-card:nth-child(2){flex:1;}
.landing .res-row-2 .res-card:nth-child(1){flex:1;}
.landing .res-row-2 .res-card:nth-child(2){flex:1.45;}

.landing .res-badge{
  position:absolute;
  top:-24px;
  left:20px;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:0;
}

.landing .res-badge-sq{
  width:48px;
  height:48px;
  background:#F7C94B;
  border-radius:16px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#23316E;
}

.landing .res-badge-pill{
  background:#F7C94B;
  color:#1a1f3c;
  font-size:1.1rem;
  font-weight:800;
  padding:13px 22px;
  border-radius:50px;
  white-space:nowrap;
  line-height:1;
  letter-spacing:-0.01em;
}

.landing .res-desc{
  font-size:1.2rem;
  font-weight:400;
  color:#fff;
  line-height:1.75;
  text-align:center;
  margin:0;
  width:100%;
}

.landing .footer{
  background:#F4F5FB;
  padding:50px 60px 20px;
  margin-top:0;
  color:#23316E;
}

.landing .footer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  margin-bottom:24px;
}

.landing .footer-col{
  justify-self:end;
  text-align:right;
}

.landing .footer-brand-top{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}

.landing .footer-brand-texts{
  display:flex;
  flex-direction:column;
  line-height:1.35;
}

.landing .footer-brand-name{
  font-size:1rem;
  font-weight:800;
  color:var(--text);
}

.landing .footer-brand-sub{
  font-size:0.95rem;
  font-weight:600;
  color:var(--text);
}

.landing .footer-desc{
  font-size:0.90rem;
  color:var(--text);
  line-height:1.8;
  max-width:300px;
  margin:0;
}

.landing .footer-col-title{
  font-size:0.78rem;
  font-weight:700;
  color:var(--text);
  letter-spacing:0.07em;
  margin-bottom:16px;
}

.landing .footer-links{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.landing .footer-links span{
  font-size:0.8rem;
  color:#23316E;
  line-height:1.6;
}

@media(max-width:980px){
  .landing .resources-section{padding:20px 36px 50px;}
  .landing .res-row{flex-direction:column;gap:40px;}
  .landing .feat-cards{grid-template-columns:1fr;}
  .landing .feat-card:hover{transform:scale(1.02);}
}

@media(max-width:720px){
  .landing .navbar{
    height:auto;
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }
  .landing .nav-right{
    width:100%;
    justify-content:space-between;
    gap:16px;
  }
  .landing .hero-card{height:390px;}
  .landing .hero-content{padding:0 24px 36px;}
  .landing .hero-text{font-size:1.05rem;}
  .landing .feat-header{align-items:flex-start;flex-direction:column;gap:14px;}
  .landing .fb-link{font-size:1rem;}
  .landing .resources-section{padding:20px 20px 44px;}
  .landing .res-badge{right:20px;align-items:flex-start;}
  .landing .res-badge-pill{white-space:normal;text-align:left;font-size:.92rem;line-height:1.2;}
  .landing .res-desc{font-size:1rem;}
  .landing .footer{padding:36px 24px 20px;}
  .landing .footer-grid{grid-template-columns:1fr;gap:26px;}
  .landing .footer-col{justify-self:start;text-align:left;}
}

@media(max-width:480px){
  .landing .brand-name{font-size:1rem;}
  .landing .brand-sub{font-size:.8rem;}
  .landing .brand img,
  .landing .footer-brand-top img{width:64px !important;height:42px !important;}
  .landing .nav-right{align-items:stretch;}
  .landing .btn-signup,
  .landing .btn-login{text-align:center;}
  .landing .res-card{padding:64px 22px 28px;}
  .landing .res-badge{left:14px;right:14px;}
}
.landing .landing-footer-anchor{position:relative;top:-76px;display:block;height:0;overflow:hidden;}


/* Compact public navbar update */
.landing .navbar{
  height:64px;
  padding:10px 24px;
  background:rgba(244,245,251,.96);
  border-bottom:1px solid rgba(35,49,110,.08);
  box-shadow:0 8px 24px rgba(35,49,110,.04);
}

.landing .brand{gap:10px;}
.landing .brand img{
  width:64px !important;
  height:42px !important;
  border-radius:7px !important;
}

.landing .brand-name{
  font-size:1.05rem;
  font-weight:800;
  line-height:1.15;
}

.landing .brand-sub{
  font-size:.82rem;
  line-height:1.15;
}

.landing .nav-right{gap:10px;}

.landing .btn-signup,
.landing .btn-login{
  min-width:94px;
  padding:8px 18px;
  border-radius:11px;
  font-size:.86rem;
  line-height:1.2;
  text-align:center;
}

.landing.landing-nav-shell .navbar{
  position:sticky;
  top:0;
}

@media(max-width:720px){
  .landing .navbar{
    height:auto;
    padding:12px 16px;
    gap:12px;
  }
  .landing .brand img{width:58px !important;height:38px !important;}
  .landing .nav-right{gap:10px;}
  .landing .btn-signup,
  .landing .btn-login{flex:1;padding:9px 14px;}
}


/* GuidePal + student engagement enhancements */
.mood-btn input{position:absolute;opacity:0;pointer-events:none}
.mood-btn{position:relative;cursor:pointer;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.mood-btn:hover{transform:translateY(-1px);box-shadow:0 10px 18px rgba(35,49,110,.08)}
.mood-btn:has(input:checked){background:linear-gradient(135deg,rgba(35,49,110,.12),rgba(61,99,221,.12));border-color:rgba(61,99,221,.35);box-shadow:0 12px 22px rgba(35,49,110,.10)}
@media (max-width:840px){
  .sidebar{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}


/* ===== Responsive and admin overrides ===== */
body.sidebar-open{
  overflow:hidden;
}

.sidebar{
  overflow:hidden;
}
.sidebar-nav{
  overflow:auto;
  min-height:0;
  flex:1 1 auto;
}

.right-column,
.right-column .card,
.right-column .dashboard-calendar-card,
.right-column .card-item,
.right-column .item-body,
.main-column,
.page-body,
.welcome-banner,
.template-stats,
.table-wrap,
.responsive-table-wrap{
  min-width:0;
}

.right-column{
  width:100%;
}
.content.has-right-panel > main#pageSearchRoot > .page-body{
  grid-template-columns:minmax(0,1fr) minmax(300px,var(--right-panel-width));
}
.right-column .card-item{
  align-items:flex-start;
}
.right-column .item-body{
  flex:1 1 auto;
}
.right-column .item-title,
.right-column .item-desc,
.right-column .item-time{
  word-break:break-word;
  overflow-wrap:anywhere;
}

.menu-toggle{
  display:none;
}

.card-pad{
  padding:22px;
}

.section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:18px;
}
.section-head h2,
.section-head h3{margin-bottom:6px}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap}
.action-stack{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.inline-form{display:inline-flex}

.responsive-table{width:100%}
.responsive-table td,
.responsive-table th{
  vertical-align:top;
}

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

@media (max-width: 1180px){
  .content.has-right-panel > main#pageSearchRoot > .page-body{
    grid-template-columns:1fr;
  }
  .right-column{
    position:static;
    top:auto;
  }
  .admin-stats,
  .template-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 900px){
  .content{
    padding:16px;
  }

  .content-wrap{
    margin-left:0;
  }

  .sidebar{
    inset:0 auto 0 0;
    width:min(88vw, 300px);
    min-width:min(88vw, 300px);
    max-width:min(88vw, 300px);
    height:100vh;
    border-radius:0 22px 22px 0;
    transform:translateX(-105%);
    transition:transform var(--transition);
    z-index:1300;
  }

  body.sidebar-open .sidebar{
    transform:translateX(0);
  }

  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  .topbar{
    position:sticky;
    top:0;
    z-index:1100;
  }

  .template-topbar{
    grid-template-columns:1fr;
    height:auto;
    gap:12px;
  }

  .template-header-right{
    width:100%;
    flex-wrap:wrap;
    justify-content:flex-start;
  }

  .topbar-search{
    width:min(100%, 100%);
    order:10;
    flex:1 1 100%;
  }

  .topbar-profile{
    max-width:100%;
  }

  .grid-2,
  .admin-stats,
  .template-stats{
    grid-template-columns:1fr;
  }

  .welcome-banner{
    padding:22px;
  }

  .section-head{
    flex-direction:column;
  }

  .card,
  .welcome-banner,
  .template-stat,
  .dashboard-calendar-card{
    width:100%;
  }
}

@media (max-width: 720px){
  .page-body{
    gap:16px;
  }

  .responsive-table-wrap{
    overflow:visible;
  }

  .responsive-table,
  .responsive-table thead,
  .responsive-table tbody,
  .responsive-table th,
  .responsive-table td,
  .responsive-table tr{
    display:block;
    width:100%;
  }

  .responsive-table thead{
    display:none;
  }

  .responsive-table tbody{
    display:grid;
    gap:14px;
  }

  .responsive-table tr{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:18px;
    box-shadow:var(--shadow-xs);
    padding:12px 14px;
  }

  .responsive-table td{
    border:none;
    padding:8px 0;
  }

  .responsive-table td::before{
    content:attr(data-label);
    display:block;
    color:var(--muted);
    font-size:.78rem;
    font-weight:700;
    margin-bottom:4px;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
}

/* Merged from groupmate version: sidebar divider styling */
.nav-divider{margin:14px 0 8px;padding-top:12px;border-top:1px solid rgba(var(--primary-rgb),.12);}
.nav-divider span{display:block;padding:0 12px;color:var(--muted);font-size:.72rem;font-weight:800;letter-spacing:.06em;line-height:1.25;text-transform:uppercase;}


/* Merged from groupmate version: AI Center and AI assistance UI */
/* --------------------------------------------------------------------------
   AI assistance components
   -------------------------------------------------------------------------- */
:root{
  --ai-blue:#3563a7;
  --ai-blue-strong:#254f91;
  --ai-blue-soft:#edf6ff;
  --ai-blue-border:#cfe2fb;
  --ai-green:#20875a;
  --ai-green-bg:#eaf8f0;
  --ai-amber:#a86613;
  --ai-amber-bg:#fff5df;
  --ai-red:#bf3f4a;
  --ai-red-bg:#fff1f2;
}

.ai-page-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:18px;
  padding:20px;
  border:1px solid rgba(var(--primary-rgb),.14);
  border-radius:var(--radius-lg);
  background:linear-gradient(135deg,#fff 0%,var(--ai-blue-soft) 100%);
  box-shadow:var(--shadow-xs);
}
.ai-page-header h2{margin:0;color:var(--text);font-size:1.2rem;line-height:1.25;}
.ai-page-header p{margin:6px 0 0;color:var(--text-soft);font-size:.92rem;line-height:1.55;max-width:760px;}

.ai-center-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  align-items:start;
}
.ai-report-card{grid-column:1 / -1;}

.ai-panel,
.ai-card,
.ai-insight-card,
.ai-report-card,
.ai-case-card{
  position:relative;
  border:1px solid rgba(var(--primary-rgb),.14);
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%);
  box-shadow:var(--shadow-xs);
}
.ai-insight-card::before,
.ai-report-card::before,
.ai-case-card::before{
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  border-radius:inherit;
  background:linear-gradient(180deg,var(--primary),var(--sky));
  pointer-events:none;
}
.ai-insight-card .section-header,
.ai-report-card .section-header,
.ai-case-card .session-card-title{
  align-items:flex-start;
  gap:12px;
}
.ai-card-kicker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  margin-bottom:8px;
  padding:5px 9px;
  border-radius:var(--radius-pill);
  background:var(--ai-blue-soft);
  color:var(--primary-strong);
  border:1px solid var(--ai-blue-border);
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.01em;
}
.ai-card-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:8px;
}
.ai-card-header strong{color:var(--text);font-size:.95rem;line-height:1.3;}
.ai-card-body{display:grid;gap:10px;}

.ai-helper-text,
.msf-ai-helper{
  color:var(--muted);
  font-size:.88rem;
  line-height:1.55;
  margin:10px 0 0;
}
.ai-muted-note{color:var(--muted);font-size:.82rem;line-height:1.45;}

.ai-action-row,
.session-note-tools{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}
.ai-action-row .btn,
.session-note-tools .btn,
.msf-ai-review,
[data-ai-schedule],
[data-ai-case-briefing],
[data-ai-session-summary]{
  min-height:40px;
  border-radius:13px;
}
.msf-ai-review,
[data-ai-schedule],
[data-ai-case-briefing],
[data-ai-session-summary]{
  border-color:rgba(var(--primary-rgb),.28);
  color:var(--primary-strong);
  background:linear-gradient(180deg,#fff 0%,var(--ai-blue-soft) 100%);
}
.msf-ai-review:hover,
[data-ai-schedule]:hover,
[data-ai-case-briefing]:hover,
[data-ai-session-summary]:hover{
  border-color:rgba(var(--primary-rgb),.45);
  box-shadow:var(--shadow-xs);
}
.msf-ai-review.is-loading,
[data-ai-schedule].is-loading,
[data-ai-case-briefing].is-loading,
[data-ai-session-summary].is-loading,
.ai-report-form button.is-loading{
  opacity:.82;
  cursor:progress;
}

.ai-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:4px 9px;
  border-radius:var(--radius-pill);
  border:1px solid var(--ai-blue-border);
  background:var(--ai-blue-soft);
  color:var(--primary-strong);
  font-size:.72rem;
  font-weight:700;
  white-space:nowrap;
}
.ai-badge.success{background:var(--ai-green-bg);border-color:var(--success-border);color:var(--ai-green);}
.ai-badge.warning{background:var(--ai-amber-bg);border-color:var(--warning-border);color:var(--ai-amber);}
.ai-badge.error{background:var(--ai-red-bg);border-color:var(--danger-border);color:var(--ai-red);}

.ai-output-list{
  display:grid;
  gap:10px;
  margin-top:12px;
}
.ai-output-item,
.ai-output,
.ai-output-empty,
.ai-inline-summary,
.ai-schedule-result,
.ai-case-result,
.msf-ai-panel,
.ai-mini-status{
  border:1px solid rgba(var(--primary-rgb),.18);
  border-radius:16px;
  background:#f8fbff;
  color:var(--text);
  padding:12px 14px;
  line-height:1.55;
  white-space:pre-line;
}
.ai-output-item,
.ai-output{box-shadow:0 8px 20px rgba(39,68,112,.05);}
.ai-output-empty{
  border-style:dashed;
  background:#fbfdff;
  color:var(--muted);
  text-align:left;
}
.ai-output-state{display:grid;gap:8px;}
.ai-output-state p{margin:0;line-height:1.55;color:var(--text-soft);}
.ai-output-state ul{margin:2px 0 0;padding-left:18px;display:grid;gap:6px;color:var(--text-soft);}
.ai-output-title{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:700;color:var(--text);}
.ai-output-footer{font-size:.82rem;color:var(--muted);line-height:1.45;margin-top:2px;}
.ai-state-loading{border-color:rgba(var(--primary-rgb),.24);background:linear-gradient(90deg,#f8fbff,#eef6ff,#f8fbff);background-size:200% 100%;animation:aiPulse 1.2s ease-in-out infinite;}
.ai-state-success{border-color:var(--success-border);background:var(--ai-green-bg);}
.ai-state-warning{border-color:var(--warning-border);background:var(--ai-amber-bg);}
.ai-state-error{border-color:var(--danger-border);background:var(--ai-red-bg);}
@keyframes aiPulse{0%{background-position:0 0}100%{background-position:-200% 0}}

.ai-inline-summary{
  margin-top:10px;
  font-size:.9rem;
  background:#fbfdff;
}
.ai-inline-summary .ai-summary-note,
.ai-inline-summary small{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:.78rem;
  line-height:1.4;
}
.ai-inline-summary dt{font-weight:700;color:var(--primary-strong);margin-bottom:4px;}
.ai-inline-summary dd{margin:0;color:var(--text-soft);}

.msf-ai-panel{
  margin:0 24px 16px;
  background:#fbfdff;
}
.msf-frame:not(.is-started) .msf-ai-helper{display:none;}
.msf-ai-panel.is-hidden{display:none;}
.msf-ai-panel strong,
.ai-output-item strong,
.ai-inline-summary strong{color:var(--primary-strong);}

.mini-analytics-list{
  display:grid;
  gap:8px;
  margin-top:14px;
}
.mini-analytics-list > div{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(35,49,110,.08);
}
.mini-analytics-list span{color:var(--text-soft);}
.mini-analytics-list strong{color:var(--primary-strong);}

.session-note-tools{margin:8px 0 12px;}
.session-ai-summary-label{display:block;margin-top:16px;}
.ai-mini-status{margin-top:10px;font-size:.88rem;}

.ai-report-form{
  display:grid;
  gap:14px;
  margin-top:12px;
}
.ai-report-form .form-row-2{align-items:end;}
.ai-report-editor{margin-top:16px;}
.ai-report-output{
  width:100%;
  border:1px solid rgba(var(--primary-rgb),.24);
  border-radius:16px;
  padding:14px;
  resize:vertical;
  min-height:260px;
  font:inherit;
  line-height:1.55;
  background:#fbfdff;
  color:var(--text);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.ai-report-output:focus{outline:none;border-color:var(--primary);box-shadow:var(--focus-ring);}
.ai-report-status{margin-top:10px;}

.ai-schedule-result,
.ai-case-result{margin-top:10px;font-size:.9rem;}
.ai-case-result{max-height:360px;overflow:auto;}

@media (max-width: 1100px){
  .ai-center-grid{grid-template-columns:1fr;}
}
@media (max-width: 900px){
  .ai-page-header{padding:16px;}
  .msf-ai-panel{margin:0 16px 14px;}
  .ai-card-header{align-items:flex-start;}
}
@media (max-width: 640px){
  .ai-page-header{display:block;}
  .ai-action-row,
  .session-note-tools{display:grid;grid-template-columns:1fr;}
  .ai-action-row .btn,
  .session-note-tools .btn,
  .msf-ai-review,
  [data-ai-schedule],
  [data-ai-case-briefing],
  [data-ai-session-summary]{width:100%;}
  .ai-card-header,.ai-output-title{align-items:flex-start;flex-direction:column;}
  .mini-analytics-list > div{align-items:flex-start;flex-direction:column;}
}