/* Visual reference: platform UX mockups 001–164, 2026-10-06.
   Real permissions, records and workflow states come from the server views. */
body[data-authenticated="1"] {
    --canvas: #faf8f3;
    --rhythm-cream: #faf8f3;
    --rhythm-forest: #103f35;
    --ink: #151b22;
    --muted: #606b79;
    --line: #dedfe1;
    --radius-lg: 12px;
    font-family: Arial, "Segoe UI", sans-serif;
}
body[data-authenticated="1"] .app-frame { grid-template-columns: 236px minmax(0,1fr); }
body[data-authenticated="1"] .app-sidebar { background: #103f35; padding: 20px 14px; }
body[data-authenticated="1"] .brand-lockup { padding: 0 6px 22px; gap: 12px; }
body[data-authenticated="1"] .brand-lockup strong { font-size: 16px; }
body[data-authenticated="1"] .brand-lockup small { font-size: 14px; line-height: 1.45; color: #e0ebe6; }
body[data-authenticated="1"] .nav-item { min-height: 46px; padding: 10px 14px; gap: 14px; font-size: 15px; font-weight: 500; }
body[data-authenticated="1"] .nav-item.is-active { font-weight: 700; color: #103f35; }
body[data-authenticated="1"] .nav-group-label { font-size: 12px; letter-spacing: .06em; color: #c2d3cd; }
body[data-authenticated="1"] .workspace-topbar { height: 72px; padding-inline: 36px; gap: 24px; background: #faf8f3; backdrop-filter: none; }
body[data-authenticated="1"] .workspace-context { flex: 0 0 auto; }
body[data-authenticated="1"] .topbar-page-search { flex: 1; width: auto; max-width: none; margin-left: 0; }
body[data-authenticated="1"] .workspace-main { width: 100%; max-width: 1600px; padding: 30px 40px 88px; }
body[data-authenticated="1"] :is(.page-heading,.workspace-header,.task-heading) { margin-bottom: 26px; gap: 24px; }
body[data-authenticated="1"] :is(.page-heading,.workspace-header,.task-heading) h1 {
    font-family: Arial, "Segoe UI", sans-serif; font-size: clamp(28px,3vw,40px);
    font-weight: 750; text-transform: none; letter-spacing: -.035em; line-height: 1.15;
    margin: 6px 0 10px; max-width: none;
}
body[data-authenticated="1"] :is(.page-heading,.workspace-header,.task-heading) p { font-size: 16px; line-height: 1.5; margin-top: 0; }
body[data-authenticated="1"] .eyebrow { color: #a03570; letter-spacing: .06em; font-size: 12px; }
body[data-authenticated="1"] .page-heading-visual-stack:not(:has(.heading-actions,.page-heading-actions)) { display: none; }
body[data-authenticated="1"] :is(.plain-section,.board-work-queue,.board-next-meeting,.board-hub-section,.hub-current-work) {
    border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: none;
}
body[data-authenticated="1"] .section-heading h2 { font-size: 21px; letter-spacing: -.02em; }
body[data-authenticated="1"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) { border-radius: 8px; }
body[data-authenticated="1"] .button { border-radius: 8px; box-shadow: none; }
body[data-authenticated="1"] .button-primary { background: #a03570; border-color: #a03570; color: #fff; }
body[data-authenticated="1"] .language-switch button { color: #515764; }
body[data-authenticated="1"] .language-switch button[aria-current="true"] { color: #103f35; }
body[data-authenticated="1"] :is(.register-table,.data-table) { font-size: 14px; }
body[data-authenticated="1"] :is(.register-table,.data-table) th { background: #f3f3f4; color: #536070; }
body[data-authenticated="1"] .everyday-shortcuts > div { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
body[data-authenticated="1"] .everyday-shortcuts a { min-height: 78px; border-radius: 12px; padding: 18px; background: #fff; }
body[data-authenticated="1"] .everyday-shortcuts h2 { font-size: 20px; }
body[data-authenticated="1"] .mockup-dashboard-body { display: grid; grid-template-columns: minmax(0,1.85fr) minmax(280px,1fr); gap: 18px; align-items: start; }
body[data-authenticated="1"] .mockup-dashboard-body > .board-work-queue { grid-column: 1; grid-row: 1 / span 2; margin: 0; padding: 20px; }
body[data-authenticated="1"] .mockup-dashboard-body > .board-next-meeting { grid-column: 2; margin: 0; padding: 20px; }
body[data-authenticated="1"] .board-queue-heading h2 { color: #a03570; }
body[data-authenticated="1"] .board-queue-link { padding-block: 18px; }
body[data-authenticated="1"] .board-priority-list .board-queue-item {
    display: block; min-height: 0; padding: 0; border-radius: 0; border: 0;
    border-bottom: 1px solid var(--line); background: transparent;
}
body[data-authenticated="1"] .board-priority-list .board-queue-link { min-height: 86px; padding: 14px 0; }
body[data-authenticated="1"] .board-queue-copy strong { color: var(--ink); font-size: 15px; }
body[data-authenticated="1"] .board-queue-copy small { font-size: 13px; }
body[data-authenticated="1"] .board-queue-action { color: #85255b; font-size: 13px; }
body[data-authenticated="1"] .board-queue-heading p { font-size: 14px; }
body[data-authenticated="1"] .board-priority-list .board-queue-item.is-urgent { margin-inline: 0; padding-inline: 0; background: transparent; }
body[data-authenticated="1"] .board-queue-icon { background: #f7e8ef; color: #a03570; }
body[data-authenticated="1"] .board-next-meeting .meeting-visual { display: none; }
body[data-authenticated="1"] .board-next-meeting .board-meeting-intro { display: block; }
body[data-authenticated="1"] .board-next-meeting .meeting-facts { display: grid; grid-template-columns: 1fr; gap: 10px; }
body[data-authenticated="1"] .board-next-meeting .meeting-facts > div { background: transparent; padding: 0; }
body[data-authenticated="1"] .board-next-meeting .meeting-date-tile { width: 92px; padding: 16px; margin: 14px 0; background: #f7e8ef; color: #a03570; text-align: center; border-radius: 12px; }
body[data-authenticated="1"] .meeting-date-tile strong { display: block; font-size: 32px; }
body[data-authenticated="1"] .board-hub-groups { gap: 18px; }
body[data-authenticated="1"] .board-hub-section { padding: 20px; }
body[data-authenticated="1"] .board-hub-grid { gap: 10px; grid-template-columns: repeat(3,minmax(0,1fr)); }
body[data-authenticated="1"] .board-hub-card { min-height: 84px; padding: 14px; border-radius: 9px; background: #fff; }
body[data-authenticated="1"] .board-hub-icon { background: #f7e8ef; border-radius: 12px; }
body[data-authenticated="1"] .board-hub-section:first-child { background: #fcf5f8; }
body[data-authenticated="1"] .board-hub-section:first-child .board-hub-card:first-child { background: #a03570; color: #fff; }
body[data-authenticated="1"] .board-hub-section:first-child .board-hub-card:first-child small { color: #fff; }
body[data-authenticated="1"] .hub-person-search { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; padding: 20px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
body[data-authenticated="1"] .hub-person-search label { grid-column: 1 / -1; font-size: 21px; font-weight: 700; }
body[data-authenticated="1"] .hub-person-search input { min-width: 0; width: 100%; }
body[data-authenticated="1"] .hub-current-work { padding: 20px; margin-bottom: 18px; }
body[data-authenticated="1"] .person-form-header h1 { font-size: clamp(32px,4.5vw,64px); text-transform: uppercase; }
body[data-authenticated="1"] .person-form-panel { border: 0; background: transparent; padding: 0; box-shadow: none; }
body[data-authenticated="1"] .person-form-panel,body[data-authenticated="1"] .person-form-header { max-width: none; width: 100%; }
body[data-authenticated="1"] .person-form .form-section { margin: 0; }
.mobile-workspace-nav,.mobile-brand-mark,.mobile-next-task { display: none; }
body[data-mail-workspace] .mobile-brand-mark { display: none; }
.register-inspector-workspace { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(300px,1fr); gap: 20px; align-items: start; }
.register-inspector-workspace > :is(.payment-review-list,.organization-review-list) { margin: 0; }
.register-inspector { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.register-inspector h2 { margin-block: 20px; font-size: 23px; }
.register-inspector-body { min-width: 0; overflow-wrap: anywhere; }
.register-inspector-body dl { display: grid; gap: 8px; }
.register-inspector-body dd { margin: 0 0 12px; }
.register-inspector-body :is(input,select,textarea) { max-width: 100%; }
.register-inspector-workspace li.is-selected { background: #f7e8ef; }
.register-inspector-workspace .organization-review-list > li { padding: 14px; }
.register-inspector-workspace .payment-review-list > li { border-radius: 0; }
.register-inspector-workspace .organization-review-heading { gap: 10px; }
.register-inspector-workspace .organization-review-heading a { color: var(--ink); }
.register-inspector[hidden] { display: none; }
body[data-authenticated="1"] .self-time-today { padding: 20px; margin-block: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
body[data-authenticated="1"] .self-time-today h3 { font-size: 25px; }
body[data-authenticated="1"] .self-time-today .button { min-height: 60px; padding-inline: 24px; }
body[data-authenticated="1"] .self-time-week { padding: 20px; margin-block: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
body[data-authenticated="1"] .self-time-week h3 { margin-top: 0; font-size: 25px; }
body[data-authenticated="1"] .self-time-week .attendance-list { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 12px; }
body[data-authenticated="1"] .self-time-week .attendance-list li { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-height: 132px; padding: 16px 12px; background: #fcfcfd; border: 1px solid var(--line); border-radius: 9px; }
body[data-authenticated="1"] .self-time-week .attendance-list time { order: 1; font-weight: 700; }
body[data-authenticated="1"] .self-time-week .attendance-list b { order: 2; font-size: 20px; }
body[data-authenticated="1"] .self-time-week .attendance-list li>span { order: 3; font-size: 13px; }
body[data-authenticated="1"] .self-time-week .attendance-list li.is-today { background: #f7e8ef; border-color: #a03570; }
body[data-authenticated="1"] .self-time-month-overview { padding: 20px; margin-block: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
body[data-authenticated="1"] .self-time-month-overview h3 { margin-top: 0; font-size: 25px; }
body[data-authenticated="1"] .self-time-month-overview .data-table { margin-bottom: 0; }
body[data-authenticated="1"] .hub-current-work .work-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
body[data-authenticated="1"] .hub-current-work .work-list li { display: block; padding: 12px; min-height: 0; border: 1px solid var(--line); border-radius: 8px; }
body[data-authenticated="1"] .hub-current-work .work-list li small { display: block; margin-top: 6px; }
body[data-authenticated="1"] .hub-current-work h2 { margin: 0 0 14px; font-size: 21px; }
body[data-authenticated="1"] .hub-person-search input { height: 44px; border: 1px solid var(--line); }
body[data-authenticated="1"] .person-form { max-width: none; gap: 12px; }
body[data-authenticated="1"] .person-form .form-section {
    display: grid; grid-template-columns: minmax(210px,.55fr) minmax(0,1fr);
    gap: 28px; padding: 24px 20px; border: 0; border-radius: 12px; background: #eaf2e7;
}
body[data-authenticated="1"] .person-form .form-section:nth-of-type(2) { background: #f5e8f0; }
body[data-authenticated="1"] .person-form .form-section:nth-of-type(3) { background: #f6efdd; }
body[data-authenticated="1"] .person-form .form-section-heading { align-items: start; }
body[data-authenticated="1"] .person-form .form-section-heading > span { background: #fff; color: #a03570; border-radius: 50%; }
body[data-authenticated="1"] .person-form .form-section-heading h2 { font-size: 20px; margin: 0 0 8px; }
body[data-authenticated="1"] .person-form .form-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
body[data-authenticated="1"] .person-form .form-actions { padding-top: 16px; border-top: 1px solid var(--line); justify-content: flex-end; }
@media (max-width:1100px) {
    body[data-authenticated="1"] .workspace-main { padding-inline: 24px; }
    body[data-authenticated="1"] .workspace-topbar { padding-inline: 24px; gap: 14px; }
    body[data-authenticated="1"] .everyday-shortcuts > div, body[data-authenticated="1"] .board-hub-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body[data-authenticated="1"] .mockup-dashboard-body { grid-template-columns: minmax(0,1.5fr) minmax(250px,1fr); }
}
@media (max-width:900px) {
    body[data-authenticated="1"] .self-time-week .attendance-list { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .mobile-brand-mark { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; }
    .mobile-brand-mark img { display: block; width: 32px; height: 32px; object-fit: contain; }
    .mobile-workspace-nav { position: fixed; bottom: 0; inset-inline: 0; z-index: 25; display: flex; background: #fff; border-top: 1px solid var(--line); padding: 6px 8px max(6px,env(safe-area-inset-bottom)); }
    .mobile-workspace-nav a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 52px; padding: 4px; color: #535d6b; font-size: 11px; text-decoration: none; text-align: center; }
    .mobile-workspace-nav a[aria-current="page"] { color: #103f35; font-weight: 700; border-bottom: 3px solid #103f35; }
    .mobile-workspace-nav .nav-item-icon img { filter: none; opacity: 1; }
    body[data-authenticated="1"] .app-frame { grid-template-columns: minmax(0,1fr); }
    body[data-authenticated="1"] .workspace-main { padding: 24px 20px 100px; }
    body[data-authenticated="1"] .workspace-topbar { padding-inline: 16px; gap: 10px; }
    body[data-authenticated="1"] .workspace-context { display: none; }
    body[data-authenticated="1"] .mockup-dashboard-body { grid-template-columns: minmax(0,1fr); }
    body[data-authenticated="1"] .mockup-dashboard-body > :is(.board-work-queue,.board-next-meeting) { grid-column: auto; grid-row: auto; }
    body[data-authenticated="1"] .person-form .form-section { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width:760px) {
    html { scroll-padding-block: 80px 110px; }
    body[data-authenticated="1"] .workspace-main :is(a,button,input,select,textarea,canvas) { scroll-margin-block: 80px 110px; }
    .register-inspector-workspace { display: block; }
    .register-inspector-workspace.has-selection > :is(.payment-review-list,.organization-review-list) { display: none; }
}
@media (max-width:540px) {
    body[data-authenticated="1"] .self-time-week .attendance-list { display: block; }
    body[data-authenticated="1"] .self-time-week .attendance-list li { min-height: 44px; display: grid; grid-template-columns: 75px minmax(0,1fr) auto; gap: 8px; padding: 10px 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; }
    body[data-authenticated="1"] .self-time-week .attendance-list li>span { order: 2; }
    body[data-authenticated="1"] .self-time-week .attendance-list b { order: 3; font-size: 15px; }
    body[data-authenticated="1"] .hub-current-work .work-list { grid-template-columns: 1fr; }
    body[data-authenticated="1"] .topbar-page-search { min-width: 44px; width: 44px; padding: 10px; flex: 0 0 44px; }
    body[data-authenticated="1"] .topbar-page-search > span { display: none; }
    body[data-authenticated="1"] .topbar-actions { gap: 6px; margin-left: auto; }
    body[data-authenticated="1"] .workspace-topbar .language-switch button { min-width: 44px; min-height: 44px; padding-inline: 7px; }
    body[data-authenticated="1"] .board-priority-list:not(.board-priority-list-secondary) > .board-queue-item:first-child { background: #f7e8ef; border: 1px solid #e7c9da; border-radius: 12px; margin-bottom: 12px; padding-inline: 12px; }
    body[data-navigation-experience="board"]:has(.board-work-queue) .everyday-shortcuts { display: none; }
    body[data-authenticated="1"] .workspace-main { padding-inline: 16px; }
    body[data-authenticated="1"] .workspace-topbar { padding-inline: 10px; gap: 8px; height: 64px; }
    body[data-authenticated="1"] .everyday-shortcuts > div,body[data-authenticated="1"] .board-hub-grid { grid-template-columns: 1fr; }
    body[data-authenticated="1"] .person-form .form-grid { grid-template-columns: 1fr; }
    body[data-authenticated="1"] .person-form .form-section { padding: 20px 16px; }
    body[data-authenticated="1"] :is(.page-heading,.workspace-header,.task-heading) h1 { font-size: 28px; }
    body[data-authenticated="1"] .person-form-header h1 { font-size: 32px; }
    body[data-authenticated="1"] .board-queue-link { grid-template-columns: 42px minmax(0,1fr); gap: 12px; }
    body[data-authenticated="1"] .board-queue-action { grid-column: 2; }
    body[data-authenticated="1"] .hub-person-search { grid-template-columns: 1fr; }
}
@media (max-width:360px) {
    body[data-authenticated="1"] .workspace-topbar .menu-button { min-width: 44px; width: 44px; min-height: 44px; }
    body[data-authenticated="1"] .workspace-topbar .menu-button span { display: none; }
    body[data-authenticated="1"] .workspace-topbar { gap: 4px; padding-inline: 8px; }
    body[data-authenticated="1"] .topbar-actions { gap: 3px; }
}
@media print { body[data-authenticated="1"] .mockup-dashboard-body { display: block; } .mobile-workspace-nav,.mobile-brand-mark { display: none !important; } }