/* Ensure [hidden] always wins over display rules like .btn{display:inline-flex} */
[hidden]{display:none!important;}

:root,[data-theme="light"]{
  /* Spacing, type, radius, shadow — unchanged */
  --font-body:'Satoshi','Inter',sans-serif;
  --text-xs:0.75rem;
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-lg:1.5rem;
  --text-xl:2.25rem;
  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.25rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-10:2.5rem;
  --radius-sm:.375rem;
  --radius-md:.5rem;
  --radius-lg:.75rem;
  --radius-full:9999px;
  --transition:180ms cubic-bezier(.16,1,.3,1);
  --shadow-sm:0 1px 3px rgba(10,20,80,.08);
  --shadow-md:0 4px 12px rgba(10,20,80,.10);
  --shadow-lg:0 12px 32px rgba(10,20,80,.14);

  /* Brand — logo blue + logo yellow */
  --color-primary:#2244cc;
  --color-primary-hover:#1a35b0;
  --color-primary-highlight:#dce4ff;
  --color-accent:#ffe135;
  --color-accent-hover:#f0cc00;
  --color-accent-highlight:#fffce0;

  /* Semantic */
  --color-mandatory:#ffe135;
  --color-missed:#cc3333;
  --color-success:#2d8a55;
  --color-success-highlight:#d5f0e3;
  --color-warning:#b87400;
  --color-warning-highlight:#fff3d0;
  --color-error:#cc3333;
  --color-error-highlight:#ffe8e8;
  --color-confirm:#2d6a9f;

  /* Alias tokens for backward compat with styles.css */
  --color-gold:#ffe135;
  --color-gold-highlight:#fffce0;
  --color-blue:#2244cc;
  --color-blue-highlight:#dce4ff;
  --color-purple:#6644bb;
  --color-purple-highlight:#ede8ff;

  /* Backgrounds — cool blue-tinted neutrals */
  --color-bg:#f0f4ff;
  --color-surface:#ffffff;
  --color-surface-2:#f5f8ff;
  --color-surface-offset:#e8eeff;
  --color-divider:#d0d8f4;
  --color-border:#c5cff0;

  /* Text */
  --color-text:#1a1f3c;
  --color-text-muted:#5a6490;
  --color-text-faint:#9da5cc;
}

[data-theme="dark"]{
  /* Brand — lightened for dark backgrounds */
  --color-primary:#5b7fe8;
  --color-primary-hover:#4d70dc;
  --color-primary-highlight:#1a2560;
  --color-accent:#ffe135;
  --color-accent-hover:#f0cc00;
  --color-accent-highlight:#2d2500;

  /* Semantic */
  --color-mandatory:#ffe135;
  --color-missed:#e05252;
  --color-success:#44aa6e;
  --color-success-highlight:#1a3828;
  --color-warning:#f0b429;
  --color-warning-highlight:#2d2200;
  --color-error:#e05252;
  --color-error-highlight:#3a1a1a;
  --color-confirm:#4a7fb5;

  /* Alias tokens */
  --color-gold:#ffe135;
  --color-gold-highlight:#2d2500;
  --color-blue:#5b7fe8;
  --color-blue-highlight:#1a2560;
  --color-purple:#9980e8;
  --color-purple-highlight:#2a2050;

  /* Backgrounds — dark navy */
  --color-bg:#111322;
  --color-surface:#181c2e;
  --color-surface-2:#1c2035;
  --color-surface-offset:#1a1f32;
  --color-divider:#242840;
  --color-border:#2e3258;

  /* Text */
  --color-text:#dcdff0;
  --color-text-muted:#7880a8;
  --color-text-faint:#4e5578;
}
*{box-sizing:border-box;margin:0;padding:0}
body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text);background:var(--color-bg);display:flex}
button{cursor:pointer;background:none;border:none;font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
.app-layout{display:flex;width:100%;min-height:100dvh}
.sidebar{width:220px;flex-shrink:0;background:var(--color-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;position:sticky;top:0;height:100dvh;overflow-y:auto;padding:var(--space-4) 0}
.sidebar-logo{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5) var(--space-6);font-size:var(--text-sm);font-weight:700;color:var(--color-text)}
.sidebar-logo svg{color:var(--color-accent)}
.sidebar-logo .logo-text span{color:var(--color-accent)}
.sidebar-logo{cursor:pointer}
.nav-section{margin-bottom:var(--space-4)}
.nav-label{font-size:.75rem;font-weight:600;color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.08em;padding:0 var(--space-5) var(--space-1)}
.nav-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-5);font-size:var(--text-sm);color:var(--color-text-muted);width:100%;text-align:left}
.nav-item.active{color:var(--color-primary);font-weight:600;background:var(--color-primary-highlight)}
.nav-item:hover{color:var(--color-text);background:var(--color-surface-offset)}
.nav-badge{margin-left:auto;font-size:.75rem;font-weight:600;background:var(--color-primary);color:var(--color-bg);padding:1px var(--space-2);border-radius:var(--radius-full)}
.sidebar-footer{margin-top:auto;padding:var(--space-4) var(--space-5);border-top:1px solid var(--color-divider)}
.sidebar-user{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) 0}
.user-avatar{width:32px;height:32px;border-radius:var(--radius-full);background:var(--color-primary-highlight);color:var(--color-primary);font-weight:700;font-size:.75rem;display:flex;align-items:center;justify-content:center}
.user-name{font-size:var(--text-sm);font-weight:600}
.user-role{font-size:.75rem;color:var(--color-text-muted)}
.main-content{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:56px;display:flex;align-items:center;gap:var(--space-4);padding:0 var(--space-6);background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10}
.topbar-title{font-size:var(--text-base);font-weight:600;flex:1}
.topbar-subtitle{font-size:.75rem;color:var(--color-text-muted);margin-left:var(--space-2)}
.page-body{flex:1;padding:var(--space-6);overflow-y:auto}
.auth-loading,.auth-required{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:var(--space-4);text-align:center;color:var(--color-text-muted)}
.spinner{width:28px;height:28px;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.skeleton{background:linear-gradient(90deg,var(--color-surface-offset) 25%,var(--color-surface) 50%,var(--color-surface-offset) 75%);background-size:200% 100%;animation:shimmer 1.4s ease-in-out infinite;border-radius:var(--radius-sm)}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.profile-hero,.card,.kpi-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.profile-hero{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5);margin-bottom:var(--space-6)}
.profile-avatar-lg{width:56px;height:56px;border-radius:var(--radius-full);background:var(--color-primary-highlight);color:var(--color-primary);font-weight:700;font-size:var(--text-lg);display:flex;align-items:center;justify-content:center}
.profile-name{font-size:var(--text-lg);font-weight:700}
.profile-email{font-size:var(--text-sm);color:var(--color-text-muted)}
.profile-role-badge{display:inline-flex;align-items:center;gap:var(--space-1);margin-top:var(--space-2);font-size:.75rem;font-weight:600;padding:2px var(--space-2);border-radius:var(--radius-full);background:var(--color-primary-highlight);color:var(--color-primary)}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:var(--space-4);margin-bottom:var(--space-8)}
.kpi-card{padding:var(--space-4) var(--space-5)}
.kpi-label{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--space-2)}
.kpi-value{font-size:var(--text-xl);font-weight:700;line-height:1;color:var(--color-text);margin-bottom:var(--space-1)}
.dashboard-grid{display:grid;grid-template-columns:1fr 320px;gap:var(--space-6);align-items:start}
.card-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-divider)}
.card-body{padding:var(--space-4) var(--space-5)}
.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}
.quick-action{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-1);padding:var(--space-3);background:var(--color-surface-offset);border-radius:var(--radius-md)}
.quick-action-label{font-size:.75rem;font-weight:600}
.quick-action-desc{font-size:.75rem;color:var(--color-text-muted)}
.meeting-list,.org-list{list-style:none}
.meeting-item,.org-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-bottom:1px solid var(--color-divider)}
.meeting-color{width:3px;height:36px;border-radius:var(--radius-full)}
.meeting-info{flex:1;min-width:0}
.meeting-name,.org-name{font-size:var(--text-sm);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meeting-meta,.org-role{font-size:.75rem;color:var(--color-text-muted)}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99}
.hamburger{display:none}
@media (max-width:768px){
  .sidebar{position:fixed;left:-220px;top:0;z-index:100;height:100%;transition:left var(--transition),box-shadow var(--transition)}
  .sidebar.open{left:0;box-shadow:var(--shadow-lg)}
  .sidebar-overlay.visible{display:block}
  .hamburger{display:flex;align-items:center;justify-content:center;width:36px;height:36px}
  .page-body{padding:var(--space-4)}
  .kpi-grid{grid-template-columns:1fr 1fr}
  .profile-hero{flex-direction:column;align-items:flex-start}
  .dashboard-grid{grid-template-columns:1fr}
}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;border:1px solid transparent;width:auto;text-decoration:none;transition:background var(--transition),border-color var(--transition),color var(--transition)}
.btn-primary,.btn.primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
.btn-primary:hover,.btn.primary:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}
.btn-secondary,.btn.secondary{background:var(--color-surface-offset);color:var(--color-text);border-color:var(--color-border)}
.btn-secondary:hover,.btn.secondary:hover{background:var(--color-divider)}
.btn-ghost,.btn.ghost{background:transparent;color:var(--color-text-muted);border-color:var(--color-border)}
.btn-ghost:hover,.btn.ghost:hover{background:var(--color-surface-offset);color:var(--color-text)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);color:var(--color-text-muted);background:transparent;border:none;cursor:pointer;flex-shrink:0}
.icon-btn:hover{background:var(--color-surface-offset);color:var(--color-text)}

/* ── PAGE LAYOUT ── */
.page-grid{display:grid;grid-template-columns:1.5fr 0.85fr;gap:var(--space-6);align-items:start}
.page-subtitle{color:var(--color-text-muted);font-size:var(--text-sm);margin-top:var(--space-1)}
.section-link{font-size:var(--text-sm);color:var(--color-primary);font-weight:600}

/* ── STATS ROW ── */
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);margin-bottom:var(--space-6)}
.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.stat-number{font-size:var(--text-xl);font-weight:700;line-height:1;color:var(--color-text);margin-bottom:var(--space-1)}
.stat-label{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em}
.kpi-delta{font-size:.75rem;color:var(--color-text-muted)}
.delta-neutral{color:var(--color-text-muted)}
.delta-up{color:var(--color-success)}
.delta-down{color:var(--color-missed)}

/* ── CARD PANEL ── */
.card-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.card-panel h2{font-size:var(--text-base);font-weight:700;margin-bottom:var(--space-4);color:var(--color-text)}
.section-note{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-4)}

/* ── FORMS ── */
.form-card{display:flex;flex-direction:column;gap:var(--space-4)}
.form-group{display:flex;flex-direction:column;gap:var(--space-1)}
.form-group label{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}
.form-group input,.form-group select{padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font:inherit;font-size:var(--text-sm);background:var(--color-surface);color:var(--color-text);width:100%;margin:0}
.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--color-divider)}

/* ── STATUS ── */
.status-message{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-weight:500;font-size:var(--text-sm)}
.status-message.hidden{display:none}
.status-message.success{background:var(--color-success-highlight);color:var(--color-success)}
.status-message.error{background:var(--color-error-highlight);color:var(--color-error)}
.status-badge{display:inline-flex;align-items:center;gap:4px;padding:2px var(--space-2);border-radius:var(--radius-full);font-size:.75rem;font-weight:600}
.status-present{background:var(--color-success-highlight);color:var(--color-success)}
.status-late{background:var(--color-primary-highlight);color:var(--color-primary)}
.status-absent{background:var(--color-error-highlight);color:var(--color-missed)}
.status-out_of_range{background:var(--color-error-highlight);color:var(--color-missed)}
.status-excused{background:var(--color-warning-highlight);color:var(--color-warning)}

/* ── TABLE ── */
.table-wrap{overflow-x:auto}
.data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.data-table th{text-align:left;font-weight:600;color:var(--color-text-muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;padding:var(--space-2) var(--space-3);border-bottom:2px solid var(--color-border)}
.data-table td{padding:var(--space-3);border-bottom:1px solid var(--color-divider);color:var(--color-text)}
.data-table tr:last-child td{border-bottom:none}

/* ── METRICS ── */
.stacked-metrics{display:flex;flex-direction:column}
.metric-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) 0;border-bottom:1px solid var(--color-divider);font-size:var(--text-sm);color:var(--color-text-muted)}
.metric-row:last-child{border-bottom:none}
.metric-row strong{color:var(--color-text);font-weight:600}

/* ── SEARCH / CONTROLS ── */
.page-controls{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;margin-bottom:var(--space-4)}
.search-input{padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font:inherit;font-size:var(--text-sm);background:var(--color-surface);color:var(--color-text);min-width:240px}
.search-input:focus{outline:none;border-color:var(--color-primary)}
.load-more{text-align:center;padding:var(--space-6) 0}

/* ── USER DIRECTORY ── */
.users-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:var(--space-4)}
.user-card{background:var(--color-surface);border:1px solid var(--color-border);border-left:4px solid var(--color-primary);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4)}
.user-info h3{font-size:var(--text-base);font-weight:700;color:var(--color-text);margin-bottom:var(--space-2)}
.user-contact{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-1)}
.user-actions{display:flex;flex-direction:column;gap:var(--space-2)}
.user-id{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-2);word-break:break-all}

/* ── PROFILE ── */
.profile-details-grid{display:flex;flex-direction:column;gap:0}
.membership-card{background:var(--color-surface-offset);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}
.membership-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-2)}
.membership-name{font-weight:600;font-size:var(--text-sm)}
.membership-meta{font-size:var(--text-sm);color:var(--color-text-muted)}
.membership-controls{margin-top:var(--space-3)}
.membership-role-badge{display:inline-flex;align-items:center;padding:2px var(--space-2);border-radius:var(--radius-full);font-size:.75rem;font-weight:600;white-space:nowrap}
.role-org-admin{background:var(--color-primary-highlight);color:var(--color-primary)}
.role-staff{background:var(--color-warning-highlight);color:var(--color-warning)}
.role-member{background:var(--color-success-highlight);color:var(--color-success)}
.member-card{background:var(--color-surface-offset);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2)}
.member-card-header{display:flex;align-items:center;gap:var(--space-3)}
.member-avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--color-primary-highlight);color:var(--color-primary);font-weight:700;font-size:var(--text-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.member-card-info{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}
.member-name{font-weight:600;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.member-contact{font-size:.75rem;color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.member-joined{font-size:.75rem;color:var(--color-text-muted)}
.detail-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-3) 0;border-bottom:1px solid var(--color-divider);font-size:var(--text-sm)}
.detail-row:last-child{border-bottom:none}
.detail-row span{color:var(--color-text-muted)}
.detail-row strong{color:var(--color-text);text-align:right}

/* ── MANDATORY / MISSED MEETING INDICATORS ── */
.meeting-mandatory .meeting-color{background:var(--color-mandatory)}
.meeting-missed .meeting-color{background:var(--color-missed)}
.badge-mandatory{display:inline-flex;align-items:center;gap:var(--space-1);font-size:.75rem;font-weight:600;color:var(--color-mandatory)}
.badge-missed{display:inline-flex;align-items:center;gap:var(--space-1);font-size:.75rem;font-weight:600;color:var(--color-missed)}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:200;padding:var(--space-4)}
.modal-overlay[hidden]{display:none}
.modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:440px;overflow:hidden}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-divider)}
.modal-header h2{font-size:var(--text-base);font-weight:700;margin:0}
.modal-body{padding:var(--space-5)}
.modal-meeting-card{background:var(--color-surface-offset);border-radius:var(--radius-md);padding:var(--space-4);margin-bottom:var(--space-4)}
.modal-meeting-name{font-size:var(--text-base);font-weight:700;color:var(--color-text);margin-bottom:var(--space-1)}
.modal-meeting-meta{font-size:var(--text-sm);color:var(--color-text-muted)}
.modal-hint{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.55;margin-bottom:var(--space-1)}
.modal-actions{display:flex;gap:var(--space-3);justify-content:flex-end;margin-top:var(--space-5)}
.btn-confirm{background:var(--color-confirm);color:#fff;border-color:var(--color-confirm)}
.btn-confirm:hover{filter:brightness(1.1)}
.modal-loading{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-8) 0;color:var(--color-text-muted);font-size:var(--text-sm)}
.modal-result{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-6) 0 var(--space-2);text-align:center}
.modal-result-icon{width:52px;height:52px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;margin-bottom:var(--space-2)}
.modal-result-icon.success{background:var(--color-success-highlight);color:var(--color-success)}
.modal-result-icon.warning{background:var(--color-warning-highlight);color:var(--color-mandatory)}
.modal-result-icon.error{background:var(--color-error-highlight);color:var(--color-missed)}
.modal-result-title{font-size:var(--text-base);font-weight:700;color:var(--color-text)}
.modal-result-detail{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.55}

/* ── RESPONSIVE PAGE GRID ── */
@media(max-width:900px){.page-grid{grid-template-columns:1fr}}
@media(max-width:600px){.form-row{grid-template-columns:1fr}.users-grid{grid-template-columns:1fr}}

/* ── PRINT ── */
@media print {
  /* Hide all app chrome */
  .sidebar,.sidebar-overlay,.topbar,.hamburger,.print-controls,.sidebar-actions{display:none!important}

  /* Collapse layout to single column */
  .app-layout{display:block}
  .main-content{margin-left:0!important;width:100%!important}
  .page-body{padding:0!important}

  /* Force white background + black text regardless of theme */
  html,body{background:#fff!important;color:#000!important;font-size:10pt;font-family:serif}
  *{color:#000!important;background:transparent!important;box-shadow:none!important}

  /* Sign-in sheet table */
  .sign-in-table{width:100%;border-collapse:collapse;font-size:9pt;page-break-inside:auto}
  .sign-in-table th,.sign-in-table td{border:1px solid #666;padding:4px 6px;text-align:left;background:#fff!important}
  .sign-in-table thead th{background:#efefef!important;font-weight:700;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .sign-in-table tr{page-break-inside:avoid}

  /* Sheet header + footnotes */
  .sheet-header{margin-bottom:12pt}
  #sheet-title{font-size:14pt;font-weight:700;margin:0 0 4pt}
  #sheet-meta{font-size:10pt;margin:0}
  .sheet-footnote,.sheet-generated{font-size:8pt;color:#555!important;margin-top:6pt}

  /* Print button hidden; sheet always visible */
  #print-sheet{display:block!important}

  /* Page setup */
  @page{size:landscape;margin:1.5cm 1cm}
}
.profile-edit-input{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface-2);color:var(--color-text);font:inherit;font-size:var(--text-sm)}
.profile-edit-input:focus{outline:none;border-color:var(--color-primary)}

/* Sidebar settings link */
.sidebar-settings-link{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) 0;font-size:.75rem;color:var(--color-text-muted);text-decoration:none;margin-top:var(--space-1)}
.sidebar-settings-link:hover{color:var(--color-primary)}

/* Profile completion banner */
.profile-banner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-5);background:var(--color-accent-highlight);border:1px solid var(--color-accent);border-radius:var(--radius-lg);margin-bottom:var(--space-6);font-size:var(--text-sm)}
.profile-banner-text{color:var(--color-text)}
.profile-banner-text strong{color:var(--color-text)}
.profile-banner-actions{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0}
.profile-banner-dismiss{background:none;border:none;cursor:pointer;color:var(--color-text-faint);font-size:1rem;line-height:1;padding:2px}
.profile-banner-dismiss:hover{color:var(--color-text-muted)}

/* Member detail bar */
.member-detail-bar{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:var(--space-5);}
.member-detail-name{font-weight:600;font-size:var(--text-base);color:var(--color-text);}
.member-detail-sub{font-size:var(--text-sm);color:var(--color-text-muted);}

/* Member list */
.member-list-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);margin-bottom:var(--space-2);cursor:pointer;transition:background var(--transition),border-color var(--transition);}
.member-list-item:hover{background:var(--color-surface-offset);border-color:var(--color-primary);}
.member-list-avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:700;flex-shrink:0;}
.member-list-info{flex:1;min-width:0;}
.member-list-name{font-weight:600;font-size:var(--text-sm);color:var(--color-text);}
.member-list-meta{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:2px;}

/* Recent attendance on profile */
.recent-attendance-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}
.recent-attendance-table th{text-align:left;padding:var(--space-2) var(--space-3);color:var(--color-text-muted);font-weight:500;border-bottom:1px solid var(--color-border);}
.recent-attendance-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border-subtle,var(--color-border));}
.recent-attendance-table tr:last-child td{border-bottom:none;}

/* Role-gated UI — hidden until body[data-role] is set by sidebar.js / dashboard.js */
.admin-only,.org-admin-only,.staff-up{display:none}
body[data-role="developer_admin"] .admin-only{display:inline-flex}
body[data-role="developer_admin"] .org-admin-only,
body[data-role="organization_admin"] .org-admin-only{display:inline-flex}
body[data-role="developer_admin"] .staff-up,
body[data-role="organization_admin"] .staff-up,
body[data-role="staff_member"] .staff-up{display:inline-flex}

