/* SchoolDay v216: floorplan viewing, schedule interaction and subject milestones.
   Branding rule: school-facing UI should inherit --schoolday-brand-font and the
   admin sub-tab/header variables wherever the control supports them. */

/* Header: one deliberate row at every width. Earlier release breakpoints are
   overridden here so the year and Change control can never occupy one another. */
.admin-body .site-header {
  position: relative !important;
  z-index: 1000 !important;
  display: grid !important;
  grid-template-columns: minmax(260px, 1fr) max-content minmax(360px, 1fr) !important;
  grid-template-areas: "brand year actions" !important;
  align-items: center !important;
  gap: clamp(.7rem, 2vw, 2rem) !important;
  min-height: 82px !important;
  height: auto !important;
  padding: .75rem clamp(.8rem, 2vw, 1.8rem) !important;
  overflow: visible !important;
}
.admin-body .site-header .header-brand {
  grid-area: brand !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: .8rem !important;
  min-width: 0 !important;
  width: auto !important;
}
.admin-body .site-header .admin-header-title-stack-v209 { min-width: 0; }
.admin-body .site-header .admin-header-title-stack-v209 h1 {
  margin: 0 !important;
  font-size: clamp(1.12rem, 1.8vw, 1.65rem) !important;
  line-height: 1.05 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-body .site-header .admin-header-title-stack-v209 .eyebrow { display: none !important; }
.admin-logo-action-v211 { flex: 0 0 auto !important; max-width: 90px; }
.admin-body .site-header .site-logo,
.admin-body .site-header .admin-thin-fallback-logo-v210 { max-width: 74px !important; max-height: 48px !important; object-fit: contain; }
.admin-school-year-control-v209 {
  grid-area: year !important;
  position: relative !important;
  justify-self: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}
.admin-school-year-current-v209 {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .65rem !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}
.admin-school-year-control-v209 .admin-banner-year {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  font-size: clamp(.9rem, 1.4vw, 1.2rem) !important;
  line-height: 1.1 !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
}
.admin-school-year-change-v209 {
  position: static !important;
  flex: 0 0 auto !important;
  order: 2 !important;
  min-height: 36px !important;
  padding: .42rem .72rem !important;
  margin: 0 !important;
  font-size: .84rem !important;
  white-space: nowrap !important;
  transform: none !important;
}
.admin-body .site-header > nav {
  grid-area: actions !important;
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: .65rem !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}
.admin-account-stack-v210 { display: grid !important; justify-items: stretch; gap: .12rem !important; }
.admin-header-user-summary-v210 { margin: 0 !important; max-width: 180px; text-align: right !important; font-size: .68rem !important; line-height: 1.05 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-school-year-chooser-v209 { position: fixed !important; inset: 0 !important; z-index: 3000 !important; width: auto !important; max-width: none !important; padding: 1rem !important; background: rgba(11,27,43,.64) !important; backdrop-filter: blur(5px); display: grid !important; place-items: center; }
.admin-school-year-dialog-v211 { width: min(520px, 94vw) !important; }
.admin-school-year-chooser-v209.hidden { display: none !important; }

/* The chosen mobile column owns all space after the fixed date column. The KS
   resources helper cell is never allowed to create a third blank column. */
@media (max-width: 900px) {
  #tab-class-calendars .responsive-calendar[data-calendar="class"] { table-layout: fixed !important; width: 100% !important; min-width: 100% !important; }
  #tab-class-calendars .responsive-calendar[data-calendar="class"] .date-col { width: 112px !important; min-width: 112px !important; max-width: 112px !important; }
  #tab-class-calendars .responsive-calendar[data-calendar="class"] .optional-col:not(.mobile-visible),
  #tab-class-calendars .responsive-calendar[data-calendar="class"] .ks-resource-row-cell:not(.mobile-visible) { display: none !important; }
  #tab-class-calendars .responsive-calendar[data-calendar="class"] .optional-col.mobile-visible { display: table-cell !important; width: calc(100% - 112px) !important; min-width: 0 !important; max-width: none !important; }
  #tab-class-calendars .responsive-calendar[data-calendar="class"] .ks-resource-row-cell { width: calc(100% - 112px) !important; min-width: 0 !important; }
  .admin-header-user-summary-v210 { display: block !important; max-width: 96px !important; text-align: right !important; font-size: 0 !important; }
  .admin-header-user-summary-v210::after { content: attr(data-short-name); display: block; max-width: 96px; overflow: hidden; color: inherit; font-size: .62rem; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
}

/* v216 final UI pass. */
.admin-banner-year-button-v216 {
  appearance: none;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  cursor: default;
  font: inherit;
}
.schedule-brand-surface-v216,
.schedule-brand-surface-v216 :is(button,input,select,textarea),
#tab-view-floorplan,
#tab-view-floorplan :is(button,input,select,textarea) {
  font-family: var(--schoolday-brand-font, inherit) !important;
}
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav,
#phonicsSubButtons.function-subnav,
#subjectKeyStageTabsV214.function-subnav {
  display: flex !important;
  flex-wrap: wrap;
  gap: .45rem;
  padding: .45rem;
  border: 1px solid var(--admin-subtab-border, var(--admin-calendar-main-header-bg, #144f8c));
  border-radius: .8rem;
  background: var(--admin-subtab-bg, #f5f8fb) !important;
}
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav button,
#phonicsSubButtons.function-subnav button,
#subjectKeyStageTabsV214.function-subnav button {
  color: var(--admin-subtab-text, var(--admin-calendar-main-header-bg, #144f8c)) !important;
  border-color: var(--admin-subtab-border, var(--admin-calendar-main-header-bg, #144f8c)) !important;
  background: var(--admin-subtab-bg, #fff) !important;
}
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav button:is(.active,.selected),
#phonicsSubButtons.function-subnav button:is(.active,.selected),
#subjectKeyStageTabsV214.function-subnav button:is(.active,.selected) {
  color: var(--admin-subtab-selected-text, var(--admin-calendar-main-header-color, #fff)) !important;
  border-color: var(--admin-subtab-selected-border, var(--admin-header-border, #f5c542)) !important;
  background: var(--admin-subtab-selected-bg, var(--admin-calendar-main-header-bg, #144f8c)) !important;
}
.schedule-panel-v214,
.schedule-list-v214,
.schedule-builder-v214,
.schedule-targets-v214,
.floorplan-design-workspace-v215,
.subject-list-v214,
.subjects-panel-v214 { gap: .75rem !important; }
.schedule-panel-v214 { padding-top: .25rem; }
.schedule-event-v214 { padding: .45rem .55rem !important; touch-action: none; }
.schedule-event-drag-handle-v216 { position: absolute; z-index: 5; display: block; background: transparent; }
.schedule-event-resize-start-v216 { top: -3px; left: 12px; right: 12px; height: 9px; cursor: ns-resize; }
.schedule-event-resize-end-v216 { bottom: -3px; left: 12px; right: 12px; height: 9px; cursor: ns-resize; }
.schedule-event-repeat-left-v216 { top: 12px; bottom: 12px; left: -3px; width: 9px; cursor: ew-resize; }
.schedule-event-repeat-right-v216 { top: 12px; right: -3px; bottom: 12px; width: 9px; cursor: ew-resize; }
.schedule-event-v214.is-dragging-v216 { opacity: .78; outline: 3px solid var(--admin-header-border, #f5c542); }
.floorplan-name-show-row-v216 { display: flex; flex: 1 1 370px; align-items: end; gap: .65rem; min-width: min(100%,370px); }
.floorplan-name-show-row-v216 > label:first-child { flex: 1 1 240px; }
.floorplan-name-show-row-v216 .check-card { flex: 0 0 auto; min-height: 42px; }
.floorplan-background-swatches-v216,.floorplan-colour-swatches-v216 { display: flex; flex-wrap: wrap; gap: .45rem; }
.floorplan-colour-swatch-v216 { width: 36px; min-width: 36px; height: 36px; padding: 0 !important; border: 2px solid #81909b !important; border-radius: 50% !important; }
.floorplan-colour-swatch-v216.selected { outline: 3px solid var(--admin-header-border, #f5c542); outline-offset: 2px; }
.floorplan-colour-dialog-v216 { width: min(560px,94vw); }
.floorplan-colour-dialog-v216 h4 { margin: .9rem 0 .4rem; }
.subject-milestone-editor-v216 { display: grid; gap: .55rem; padding: .75rem; border: 1px solid #d4dfe7; border-radius: .75rem; background: #f8fafc; }
.subject-milestone-editor-v216 h4,.subject-milestone-editor-v216 p { margin: 0; }
.subject-milestone-row-v216 { display: grid; grid-template-columns: minmax(160px,1fr) auto; gap: .5rem; align-items: center; }
.subject-milestone-list-v216,.assessment-milestones-v216 { display: flex; flex-wrap: wrap; gap: .35rem; }
.subject-milestone-chip-v216 { padding: .28rem .45rem; border: 1px solid #b8c9d5; border-radius: 999px; background: #fff; color: #28475e; font-size: .78rem; }
.assessment-milestones-v216 { grid-column: 2 / -1; padding-top: .15rem; }
.assessment-milestones-v216::before { content: "Milestones"; flex-basis: 100%; color: #667786; font-size: .72rem; font-weight: 800; }
.assessment-milestones-v216 button.current { color: var(--admin-subtab-selected-text, #fff) !important; background: var(--admin-subtab-selected-bg, var(--admin-calendar-main-header-bg, #144f8c)) !important; }
.school-plan-fit-viewport-v216 { position: relative; width: 100%; overflow: hidden; background: #eef2f5; }
.school-plan-fit-viewport-v216 .school-plan-canvas-v214 { transform-origin: top left; }
.floorplan-room-count-v216 { position: absolute; left: 50%; top: 58%; transform: translate(-50%,-50%); display: grid; place-items: center; min-width: 32px; height: 32px; padding: 0 .45rem; border: 2px solid currentColor; border-radius: 999px; background: #fff; font-size: .85rem; font-weight: 900; }
.floorplan-present-dot-v216 { width: 11px; height: 11px; padding: 0 !important; border: 1px solid #17622e !important; border-radius: 50% !important; background: #46bd68 !important; }
.floorplan-present-dot-v216:disabled { opacity: 1; }

@media (max-width: 620px) {
  .admin-school-year-current-v209 { min-width: 0 !important; }
  .admin-banner-year-button-v216 { cursor: pointer; padding: .3rem .45rem !important; border: 1px solid rgba(255,255,255,.72) !important; border-radius: .55rem !important; background: rgba(255,255,255,.1) !important; }
  #changeSchoolYearButton { display: none !important; }
  .floorplan-name-show-row-v216 { flex-wrap: nowrap; min-width: 100%; }
  .subject-milestone-row-v216 { grid-template-columns: 1fr auto; }
  .assessment-milestones-v216 { grid-column: 1; }
  .school-plan-fit-viewport-v216 { overflow: auto; }
}
/* v215 schedule and floorplan polish.
   Branding note: prefer the selected branding font wherever possible. These tools deliberately inherit --schoolday-brand-font and
   the admin header/button colour variables. New school-facing controls should
   continue to use these variables wherever the control permits it. */
.schedule-brand-surface-v215,
.schedule-brand-surface-v215 :is(button,input,select,textarea),
.schedule-event-dialog-v215,
.schedule-event-dialog-v215 :is(button,input,select,textarea) {
  font-family: var(--schoolday-brand-font, inherit) !important;
}
.schedule-manager-tabs-v215 {
  padding: .35rem;
  border: 1px solid color-mix(in srgb, var(--admin-header-border, #f5c542) 60%, #d7e0e7);
  border-radius: .8rem;
  background: color-mix(in srgb, var(--admin-header-bg, #144f8c) 7%, #fff);
}
.schedule-manager-tabs-v215 button {
  min-height: 42px;
  border: 1px solid var(--admin-header-border, #f5c542) !important;
  background: color-mix(in srgb, var(--admin-header-bg, #144f8c) 88%, #fff) !important;
  color: var(--admin-header-text, #fff) !important;
}
.schedule-manager-tabs-v215 button.active {
  outline: 3px solid color-mix(in srgb, var(--admin-header-border, #f5c542) 70%, transparent);
  box-shadow: inset 0 -4px 0 var(--admin-header-border, #f5c542) !important;
}
.registration-point-row-v215 {
  grid-template-columns: minmax(150px, 1.2fr) minmax(115px, .7fr) minmax(115px, .7fr) minmax(330px, 1.8fr) auto;
  align-items: end;
  gap: .55rem;
  margin-bottom: .45rem;
  padding: .65rem;
  border: 1px solid #d4e0e9;
  border-radius: .7rem;
  background: #fff;
}
.registration-days-label-v215 { min-width: 0; }
.registration-days-label-v215 > span { display: block; margin-bottom: .25rem; }
.registration-weekdays-v214 { display: flex; flex-flow: row nowrap; gap: .3rem; min-width: 0; }
.registration-weekdays-v214 label { display: inline-flex !important; flex: 1 1 0; flex-direction: row !important; align-items: center; justify-content: center; gap: .2rem; min-width: 52px; padding: .42rem .3rem; border: 1px solid #c7d6e1; border-radius: .45rem; background: #f6f9fb; }
.class-name-test-row-v215 { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: end; }
.compact-check-v215 { min-height: 42px; align-self: end; }
.class-name-options-v215 { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .7rem; margin: .25rem 0; }
.class-name-options-v215 h3 { margin: 0 !important; }
.class-name-options-v215 .pin-required-inline { min-height: 34px; }

.rooms-workspace-v215 { display: grid; grid-template-columns: minmax(250px, 340px) minmax(0, 1fr); gap: 1rem; align-items: start; }
.room-form-v215 { gap: .5rem !important; padding: .75rem; border: 1px solid #cbd8e2; border-radius: .75rem; background: #f8fbfd; }
.room-form-v215 h3 { margin: 0 0 .2rem; }
.compact-room-list-v215 { gap: .4rem !important; }
.room-list-item-v215 { display: grid !important; grid-template-columns: minmax(150px, 1fr) auto auto; align-items: center; gap: .6rem; padding: .55rem .7rem !important; }
.room-list-item-v215 p,.room-list-item-v215 span { margin: 0; }
.room-type-v215 { display: block; color: #667786; font-size: .78rem; }

.schedule-event-modal-v215 { z-index: 4200 !important; background: rgba(13, 27, 42, .68) !important; backdrop-filter: blur(5px); }
.schedule-event-dialog-v215 { width: min(760px, 94vw); max-height: 88dvh; overflow: auto; margin: auto; padding: 1rem; border: 3px solid var(--admin-header-border, #f5c542); border-radius: 1rem; background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.schedule-event-dialog-v215.hidden { display: block !important; }
.schedule-event-time-v215 { display: block; font-size: .7rem; }
.schedule-event-mini-targets-v215 { display: flex; flex-wrap: wrap; gap: .18rem; margin-top: .18rem; }
.schedule-event-mini-targets-v215 i { overflow: hidden; max-width: 100%; padding: .08rem .26rem; border: 1px solid color-mix(in srgb, var(--admin-header-bg, #144f8c) 45%, #fff); border-radius: 999px; background: #fff; color: #163d5e; font-size: .58rem; font-style: normal; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }

.floorplan-details-v215 { align-items: end; }
.floorplan-design-workspace-v215 { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: .75rem; min-height: 560px; }
.floorplan-room-palette-v215 { max-height: 620px; overflow-y: auto; padding: .65rem; border: 1px solid #bdccd8; border-radius: .75rem; background: #f6f9fb; }
.floorplan-room-palette-v215 h4 { margin: 0; }
.floorplan-palette-list-v215 { display: grid; gap: .35rem; }
.floorplan-palette-room-v215 { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .35rem; align-items: center; padding: .35rem; border: 1px solid #d1dde6; border-radius: .55rem; background: #fff; }
.floorplan-palette-room-v215 > button { display: grid; justify-items: start; min-width: 0; padding: .4rem .5rem !important; text-align: left; cursor: grab; }
.floorplan-palette-room-v215 small { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }
.floorplan-palette-room-v215 > label { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: .2rem; font-size: .72rem; }
.floorplan-palette-room-v215.is-hidden { opacity: .58; }
.floorplan-grid-summary-v215 > section { margin-bottom: 1rem; }
.floorplan-grid-room-v214 { align-content: center; gap: .3rem; }
.floorplan-grid-room-v214 > span { font-size: .75rem; font-weight: 500; }
.floorplan-pupil-dots-v215 { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 3px; width: 100%; }
.floorplan-pupil-dots-v215 i { width: 8px; height: 8px; border: 1px solid #687681; border-radius: 50%; background: #d1d7dc; }
.floorplan-list-summary-v215 { display: grid; gap: .35rem; }
.floorplan-summary-row-v215 { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .75rem; align-items: center; padding: .65rem .75rem; border: 1px solid #d1dde6; border-radius: .6rem; background: #fff; }
.floorplan-summary-row-v215 span { display: block; color: #687987; font-size: .78rem; }
.floorplan-item-controls-v214 { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; margin-top: .65rem; padding: .65rem; border: 1px solid #c8d6e0; border-radius: .65rem; background: #f7fafc; }
.floorplan-item-controls-v214.hidden { display: none !important; }
.resize-handle-v215 { position: absolute; z-index: 3; background: transparent; }
.resize-n-v215 { top: -6px; left: 12px; right: 12px; height: 12px; cursor: ns-resize; }
.resize-s-v215 { bottom: -6px; left: 12px; right: 12px; height: 12px; cursor: ns-resize; }
.resize-e-v215 { top: 12px; right: -6px; bottom: 12px; width: 12px; cursor: ew-resize; }
.resize-w-v215 { top: 12px; left: -6px; bottom: 12px; width: 12px; cursor: ew-resize; }
.resize-se-v215 { right: -5px; bottom: -5px; width: 18px; height: 18px; border-radius: 4px 0 0 0; background: var(--admin-header-bg, #144f8c); cursor: nwse-resize; }

@media (max-width: 900px) {
  .registration-point-row-v215 { grid-template-columns: 1fr 1fr; }
  .registration-point-row-v215 > label:first-child,.registration-days-label-v215 { grid-column: 1/-1; }
  .registration-weekdays-v214 { overflow-x: auto; }
  .registration-weekdays-v214 label { min-width: 50px; }
  .class-name-test-row-v215,.rooms-workspace-v215,.floorplan-design-workspace-v215 { grid-template-columns: 1fr; }
  .floorplan-room-palette-v215 { max-height: 300px; }
  .room-list-item-v215 { grid-template-columns: 1fr auto; }
  .room-list-item-v215 > .muted { grid-column: 1; }
}

/* Loaded pupil: fixed secondary navigation between identity and content. */
.pupil-workspace-v210:not(.hidden) {
  display: grid !important;
  grid-template-columns: minmax(165px, 220px) minmax(0, 1fr);
  grid-template-areas: "heading heading" "location location" "nav panel";
  gap: .9rem 1rem;
  align-items: start;
}
.pupil-workspace-heading-v213 { grid-area: heading; }
.pupil-location-v213 { grid-area: location; }
.pupil-workspace-tabs-v213 {
  grid-area: nav;
  position: sticky;
  top: 1rem;
  display: grid !important;
  grid-auto-flow: row !important;
  grid-template-columns: 1fr !important;
  gap: .35rem !important;
  max-height: calc(100dvh - 180px);
  overflow-y: auto !important;
  padding: .55rem !important;
  border: 1px solid #bfd0de;
  border-radius: .85rem;
  background: #f4f8fb;
}
.pupil-workspace-tabs-v213 button { width: 100% !important; justify-content: flex-start !important; text-align: left !important; }
.pupil-panel-v213 { grid-area: panel; min-width: 0; margin: 0 !important; }
.pupil-learning-subjects-v214,.subject-key-stage-tabs-v214,.attendance-view-tabs-v213,.register-view-tabs-v214,.schedule-manager-tabs-v214 { display: flex; flex-wrap: wrap; gap: .45rem; margin: .55rem 0 1rem; }
.pupil-learning-subjects-v214 button.active,.subject-key-stage-tabs-v214 button.active,.register-view-tabs-v214 button.active,.schedule-manager-tabs-v214 button.active { box-shadow: inset 0 -3px 0 #f5c542; }
.incident-link-picker-v214 { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .45rem; padding: .75rem; margin: .7rem 0; border: 1px solid #cbd8e3; border-radius: .8rem; background: #f8fbfd; }
.incident-link-picker-v214 > div { grid-column: 1/-1; }
.incident-linked-pupils-v214 { display: flex; flex-wrap: wrap; gap: .35rem; }
.incident-linked-pupils-v214 .incident-tag-v214 { display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .55rem; border-radius: 999px; background: #e6f1fb; border: 1px solid #8cb5d8; }
.incident-mention-suggestions-v214 { display: flex; flex-wrap: wrap; gap: .35rem; padding: .45rem; border: 1px solid #cbd8e3; border-radius: .6rem; }
.body-map-canvas-v213 svg { width: 100%; max-width: 620px; height: auto; touch-action: none; background: #eef2f5; border-radius: .85rem; }
.body-map-canvas-v213 .body-silhouette-v214 { fill: #fff; stroke: #263746; stroke-width: 2.4; }
.body-map-canvas-v213 .body-detail-v214 { fill: none; stroke: #8795a1; stroke-width: 1.2; }
.body-map-canvas-v213 .body-mark-v214 { fill: none; stroke: #d72828; stroke-width: 11; stroke-linecap: round; stroke-linejoin: round; opacity: .78; }

/* Assessment tools. */
.subject-choice-grid-v214 { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: .7rem; }
.subject-choice-grid-v214 button { min-height: 70px; }
.assess-sticky-heading-v214 { position: sticky; top: .4rem; z-index: 8; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .8rem; padding: .65rem; margin-bottom: .65rem; border: 1px solid #bed0df; border-radius: .8rem; background: rgba(255,255,255,.96); }
.assessment-pupil-row-v214 { display: grid; grid-template-columns: minmax(150px,1fr) minmax(300px,2fr) auto; gap: .6rem; align-items: center; padding: .65rem; border-bottom: 1px solid #d9e2e9; background: #fff; }
.assessment-grade-buttons-v214 { display: flex; flex-wrap: wrap; gap: .35rem; }
.assessment-grade-buttons-v214 button { min-width: 42px; color: #102435 !important; border-width: 2px !important; }
.assessment-grade-buttons-v214 button.current { outline: 3px solid #142f4a; outline-offset: 2px; }
.assessment-note-v214 { grid-column: 1/-1; display: grid; grid-template-columns: 1fr auto; gap: .45rem; }
.subject-list-v214 { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: .7rem; }
.subject-card-v214 { padding: .8rem; border: 1px solid #bdcddb; border-radius: .8rem; background: #fff; }
.subject-grade-row-v214 { display: grid; grid-template-columns: minmax(100px,1fr) auto auto auto auto auto; gap: .45rem; align-items: center; padding: .45rem; border-bottom: 1px solid #e2e8ed; }

/* Schedule, registration and floorplan editor. */
.schedule-panel-v214 { margin-top: .75rem; }
.registration-point-row-v214 { display: grid; grid-template-columns: minmax(150px,1.4fr) repeat(2,minmax(105px,.7fr)) minmax(220px,1fr) auto; gap: .45rem; align-items: end; padding: .55rem; border-bottom: 1px solid #dce4eb; }
.schedule-builder-v214 { display: grid; grid-template-columns: minmax(0,1fr) minmax(190px,260px); gap: .8rem; }
.schedule-week-grid-v214 { display: grid; grid-template-columns: repeat(5,minmax(130px,1fr)); min-height: 620px; overflow-x: auto; border: 1px solid #b8cad8; background: #fff; }
.schedule-day-v214 { position: relative; min-width: 130px; height: 620px; border-right: 1px solid #cbd8e2; background: repeating-linear-gradient(to bottom,#fff 0,#fff 25px,#edf2f6 26px); touch-action: none; }
.schedule-day-v214 > h4 { position: sticky; top: 0; z-index: 4; margin: 0; padding: .4rem; text-align: center; background: #144f8c; color: #fff; }
.schedule-event-v214 { position: absolute; left: 5px; right: 5px; z-index: 2; overflow: hidden; padding: .3rem; border: 2px solid #144f8c; border-radius: .45rem; background: #dceffc; color: #123653; cursor: pointer; font-size: .76rem; }
.schedule-event-v214.selected { outline: 3px solid #f5c542; }
.schedule-targets-v214 { max-height: 620px; overflow-y: auto; padding: .65rem; border: 1px solid #c7d6e1; border-radius: .75rem; background: #f6f9fb; }
.schedule-target-chip-v214 { display: block; width: 100%; margin: .28rem 0; text-align: left; cursor: grab; }
.schedule-event-editor-v214 { margin: .75rem 0; padding: .75rem; border: 1px solid #b7cada; border-radius: .8rem; background: #f8fbfd; }
.floorplan-grid-v214 { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: .6rem; }
.floorplan-grid-room-v214 { min-height: 90px; display: grid; place-items: center; padding: .6rem; border: 2px solid #144f8c; border-radius: .65rem; background: #fff; color: #144f8c; font-weight: 800; }
.floorplan-editor-viewport-v214,.school-plan-viewport-v214 { width: 100%; min-height: 540px; overflow: auto; border: 1px solid #aebfcb; border-radius: .7rem; background: #eef1f3; touch-action: pan-x pan-y pinch-zoom; }
.floorplan-canvas-editor-v214,.school-plan-canvas-v214 { position: relative; width: 1400px; height: 900px; transform-origin: 0 0; background: #fff; background-image: linear-gradient(#edf1f4 1px,transparent 1px),linear-gradient(90deg,#edf1f4 1px,transparent 1px); background-size: 20px 20px; }
.floorplan-item-v214 { position: absolute; display: grid; place-items: center; padding: .2rem; border: 3px solid #144f8c; background: #fff; color: #144f8c; font-weight: 800; text-align: center; user-select: none; touch-action: none; overflow: hidden; }
.floorplan-item-v214.selected { outline: 4px solid #f5c542; outline-offset: 2px; }
.floorplan-item-v214 .resize-handle-v214 { position: absolute; right: -1px; bottom: -1px; width: 18px; height: 18px; background: #144f8c; cursor: nwse-resize; }
.school-plan-dot-v214 { position: absolute; z-index: 10; width: 16px; height: 16px; min-width: 0; min-height: 0; padding: 0; border-radius: 50%; border: 2px solid #626d76; background: #c8cdd1; transform: translate(-50%,-50%); transition: left .8s ease,top .8s ease,transform .25s ease,background .25s ease; cursor: pointer; }
.school-plan-dot-v214.status-present,.school-plan-dot-v214.status-late { background: #54ba70; border-color: #1d4d2e; }
.school-plan-dot-v214.status-authorised-absence { background: #f5c542; border-color: #755d00; }
.school-plan-dot-v214.status-absent { background: #e45151; border-color: #782020; }
.school-plan-dot-v214.status-out,.school-plan-dot-v214.status-unmarked { background: #c8cdd1; border-color: #626d76; }
.school-plan-dot-v214.muted { background: #aeb6bd; border-color: #626d76; }
.school-plan-dot-v214.focus { transform: translate(-50%,-50%) scale(1.65); box-shadow: 0 0 0 5px rgba(245,197,66,.5); z-index: 20; }
.school-plan-viewer-v214:fullscreen { padding: 1rem; overflow: auto; background: #eef2f5; }

/* v216.1: compact, separated Floorplan controls. ID-scoped selectors keep this
   stable alongside the accumulated release compatibility CSS. */
#tab-schedule-floorplan .schedule-panel-v214 { min-width: 0; }
#floorplanEditorV214 { display: grid; gap: .85rem; min-width: 0; }
#floorplanEditorV214.hidden { display: none !important; }
#floorplanDetailsV214.floorplan-details-v215 {
  display: grid !important;
  grid-template-columns: minmax(270px, 1fr) auto;
  gap: .7rem 1rem !important;
  align-items: end;
  margin: 0 0 .85rem;
  padding: .75rem;
  border: 1px solid #c9d7e1;
  border-radius: .8rem;
  background: #f8fafc;
}
#floorplanDetailsV214 .floorplan-name-show-row-v216 {
  grid-column: 1;
  min-width: 0;
  gap: .6rem;
}
.floorplan-background-control-v2161 {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: .38rem;
  min-width: 0;
}
.floorplan-background-control-v2161 > span {
  margin-right: .15rem;
  color: #425a6b;
  font-size: .76rem;
  font-weight: 800;
}
.floorplan-background-swatches-v216 { gap: .3rem !important; }
.floorplan-background-swatches-v216 .floorplan-colour-swatch-v216 {
  width: 30px;
  min-width: 30px;
  height: 30px;
}
.floorplan-background-picker-v2161 {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: .3rem;
  margin: 0;
  color: #425a6b;
  font-size: .72rem;
  cursor: pointer;
}
.floorplan-background-picker-v2161 input[type="color"] {
  appearance: none;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 2px !important;
  border: 2px solid var(--admin-subtab-border, #81909b) !important;
  border-radius: .55rem !important;
  background: #fff !important;
  cursor: pointer;
}
.floorplan-background-picker-v2161 input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.floorplan-background-picker-v2161 input[type="color"]::-webkit-color-swatch { border: 0; border-radius: .3rem; }
.floorplan-background-picker-v2161 input[type="color"]::-moz-color-swatch { border: 0; border-radius: .3rem; }
.floorplan-toolbar-v2161 {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  padding-top: .65rem;
  border-top: 1px solid #d9e2e8;
}
.floorplan-image-controls-v2162 {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  padding: .6rem;
  border: 1px solid #d6e0e7;
  border-radius: .65rem;
  background: #fff;
}
.floorplan-image-import-v2162 {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: .36rem .62rem;
  border: 1px solid var(--admin-subtab-border, var(--admin-calendar-main-header-bg, #144f8c));
  border-radius: .55rem;
  background: var(--admin-subtab-bg, #fff);
  color: var(--admin-subtab-text, var(--admin-calendar-main-header-bg, #144f8c));
  font-size: .78rem;
  font-weight: 800;
  line-height: 1.15;
  cursor: pointer;
}
.floorplan-image-controls-v2162 > .muted { flex: 1 1 150px; min-width: 0; overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.floorplan-image-controls-v2162 .check-card { flex: 0 0 auto; min-height: 34px; margin: 0; }
.floorplan-image-help-v2162 { grid-column: 1 / -1; margin: -.25rem 0 0; font-size: .72rem; }
.floorplan-item-v214.transparent-room-v2162 {
  background: transparent !important;
  text-shadow: 0 0 3px #fff,0 0 5px #fff;
}
.floorplan-toolbar-v2161 button,
#floorplanItemControlsV214 button,
#floorplanListV214 button,
.room-list-item-v215 button {
  min-height: 34px !important;
  padding: .36rem .62rem !important;
  font-size: .78rem !important;
  line-height: 1.15;
}
.floorplan-design-workspace-v215 { gap: 1rem !important; min-width: 0; }
.floorplan-room-palette-v215 { min-width: 0; padding: .55rem !important; }
.floorplan-room-palette-v215 > p { margin: .3rem 0 .6rem; font-size: .76rem; line-height: 1.3; }
.floorplan-palette-list-v215 { gap: .48rem !important; }
.floorplan-palette-room-v215 {
  min-width: 0;
  gap: .55rem !important;
  padding: .28rem !important;
}
.floorplan-palette-room-v215 > button {
  min-height: 0 !important;
  padding: .34rem .42rem !important;
  font-size: .8rem !important;
  line-height: 1.15;
}
.floorplan-palette-room-v215 strong,
.floorplan-palette-room-v215 small { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.floorplan-palette-room-v215 > label { flex-shrink: 0; margin: 0; }
.compact-room-list-v215 { display: grid; gap: .5rem !important; }
.room-list-item-v215 { min-width: 0; margin: 0 !important; font-size: .84rem; }

@media (max-width: 900px) {
  #floorplanDetailsV214.floorplan-details-v215 { grid-template-columns: 1fr; }
  #floorplanDetailsV214 .floorplan-name-show-row-v216,
  .floorplan-background-control-v2161,
  .floorplan-image-controls-v2162,
  .floorplan-image-help-v2162,
  .floorplan-toolbar-v2161 { grid-column: 1; }
  .floorplan-background-control-v2161 { justify-content: flex-start; }
}

@media (max-width: 620px) {
  #floorplanDetailsV214 .floorplan-name-show-row-v216 { flex-wrap: wrap; }
  .floorplan-toolbar-v2161 button { flex: 1 1 auto; }
  .floorplan-image-controls-v2162 > * { flex: 1 1 auto; }
  .floorplan-background-picker-v2161 span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}

/* Attendance calendar: a true Monday-first month layout with neutral days when
   no completed registration point is expected. */
.attendance-calendar-months-v214 { display: grid; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); gap: .85rem; }
.attendance-calendar-month-v214 { padding: .7rem; border: 1px solid #c8d6e1; border-radius: .8rem; background: #fff; }
.attendance-calendar-month-v214 h3 { margin: 0 0 .45rem; }
.attendance-calendar-weekdays-v214 { display: grid; grid-template-columns: repeat(7,1fr); gap: .25rem; margin-bottom: .25rem; }
.attendance-calendar-weekdays-v214 span { text-align: center; color: #52606c; font-size: .72rem; font-weight: 800; }
.attendance-day-v213.empty { visibility: hidden; }
.attendance-day-v213.no-session { background: #f5f7f8; color: #7d8790; border-color: #e0e5e9; }

/* Routine editor: class title and weekday labels share the header line; the PIN
   field appears only after Update PIN is deliberately selected. */
.routine-class-card-v214 .routine-title-days-v214 { display: grid; grid-template-columns: minmax(140px,1fr) repeat(5,minmax(100px,1fr)); gap: .35rem; align-items: end; }
.routine-class-card-v214 .routine-title-days-v214 h3 { margin: 0; }
.routine-class-card-v214 .routine-title-days-v214 span { text-align: center; font-weight: 800; }
.routine-class-card-v214 .routine-body-v214 { display: grid; grid-template-columns: minmax(140px,1fr) repeat(5,minmax(100px,1fr)); gap: .35rem; }
.routine-pin-panel-v214 { display: grid; gap: .35rem; align-content: start; }
.routine-pin-panel-v214 input.hidden { display: none !important; }
.routine-day-field-v214 { min-width: 0; }
.routine-day-field-v214 > span { display: none; }
.routine-body-v214 textarea { width: 100%; min-width: 0; }

/* Policies: Total Policies uses the same dark grey for its border and text. */
.policies-body .policy-review-card:first-child,
.policies-body .policy-review-card.policy-total-v214 { color: #46515b !important; border-color: #46515b !important; background: #f7f8f9 !important; }

@media (max-width: 1100px) {
  .admin-body .site-header { grid-template-columns: minmax(180px,1fr) max-content minmax(210px,1fr) !important; gap: .55rem !important; }
  .admin-body .site-header > nav > a,#adminZoomControls { display: none !important; }
  .change-school-button { padding-inline: .5rem !important; font-size: .78rem !important; }
  .schedule-builder-v214 { grid-template-columns: 1fr; }
  .schedule-targets-v214 { max-height: none; }
}

@media (max-width: 900px) {
  .admin-body .site-header {
    grid-template-columns: minmax(48px,1fr) max-content minmax(66px,1fr) !important;
    grid-template-areas: "brand year actions" !important;
    min-height: 56px !important;
    padding: .35rem .45rem !important;
    gap: .3rem !important;
  }
  .admin-body .site-header .change-school-button,.admin-header-title-stack-v209,.admin-body .site-header > nav > a,#adminZoomControls { display: none !important; }
  .admin-logo-action-v211 { max-width: 48px; padding: .15rem !important; }
  .admin-body .site-header .site-logo,.admin-body .site-header .admin-thin-fallback-logo-v210 { max-width: 42px !important; max-height: 38px !important; }
  .admin-school-year-current-v209 { gap: .28rem !important; }
  .admin-school-year-control-v209 .admin-banner-year { font-size: clamp(.66rem,3.1vw,.82rem) !important; }
  .admin-school-year-change-v209 { min-height: 29px !important; padding: .24rem .4rem !important; font-size: .66rem !important; }
  .admin-body .site-header > nav { gap: 0 !important; }
  #signOutButton { min-height: 31px !important; padding: .3rem .48rem !important; font-size: .72rem !important; }
  .admin-header-user-summary-v210 { max-width: 76px; font-size: .58rem !important; }
  .pupil-workspace-v210:not(.hidden) { grid-template-columns: minmax(118px,35vw) minmax(0,1fr); gap: .55rem; }
  .pupil-workspace-tabs-v213 { top: .4rem; padding: .35rem !important; max-height: calc(100dvh - 120px); }
  .pupil-workspace-tabs-v213 button { min-height: 42px; padding: .45rem !important; font-size: .78rem !important; white-space: normal; }
  .pupil-workspace-heading-v213 { grid-template-columns: 1fr !important; }
  .pupil-save-actions-v213 { width: 100%; }
  .assessment-pupil-row-v214 { grid-template-columns: 1fr; }
  .assessment-grade-buttons-v214 button { min-width: 50px; min-height: 48px; }
  .subject-grade-row-v214,.registration-point-row-v214 { grid-template-columns: 1fr 1fr; }
  .schedule-week-grid-v214 { grid-template-columns: repeat(5,145px); }
  .routine-class-card-v214 .routine-title-days-v214 { display: none; }
  .routine-class-card-v214 .routine-body-v214 { grid-template-columns: 1fr; }
  .routine-day-field-v214 > span { display: block; margin-bottom: .2rem; font-weight: 800; }
}

/* v215 final cascade overrides. Keep these after the inherited v214 rules so
   the compact registration editor and branded schedule controls remain stable. */
.schedule-manager-tabs-v214.schedule-manager-tabs-v215 {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: .45rem;
  border: 1px solid color-mix(in srgb, var(--admin-header-border, #f5c542) 55%, #cbd8e2);
  border-radius: .8rem;
  background: #f5f8fb;
}
.schedule-manager-tabs-v214.schedule-manager-tabs-v215 button {
  color: var(--admin-calendar-main-header-bg, #144f8c) !important;
  border-color: var(--admin-calendar-main-header-bg, #144f8c) !important;
  background: #fff !important;
}
.schedule-manager-tabs-v214.schedule-manager-tabs-v215 button.active {
  color: var(--admin-calendar-main-header-color, #fff) !important;
  background: var(--admin-calendar-main-header-bg, #144f8c) !important;
}
.registration-point-row-v214.registration-point-row-v215 {
  grid-template-columns: minmax(160px,1.2fr) minmax(100px,.65fr) minmax(100px,.65fr) minmax(300px,1.5fr) auto;
}
.schedule-event-mini-targets-v215 i {
  border-color: var(--admin-calendar-main-header-bg, #144f8c);
}
.resize-se-v215 {
  background: var(--admin-calendar-main-header-bg, #144f8c);
}

@media (max-width: 900px) {
  .registration-point-row-v214.registration-point-row-v215 { grid-template-columns: 1fr 1fr; }
  .registration-point-row-v214.registration-point-row-v215 > label:first-child,
  .registration-point-row-v214.registration-point-row-v215 .registration-days-label-v215 { grid-column: 1/-1; }
}

/* v216 must remain after inherited v215 cascade rules. */
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav { background: var(--admin-subtab-bg, #f5f8fb) !important; border-color: var(--admin-subtab-border, var(--admin-calendar-main-header-bg, #144f8c)) !important; }
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav button { color: var(--admin-subtab-text, var(--admin-calendar-main-header-bg, #144f8c)) !important; border-color: var(--admin-subtab-border, var(--admin-calendar-main-header-bg, #144f8c)) !important; background: var(--admin-subtab-bg, #fff) !important; }
.schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav button:is(.active,.selected) { color: var(--admin-subtab-selected-text, #fff) !important; border-color: var(--admin-subtab-selected-border, var(--admin-header-border, #f5c542)) !important; background: var(--admin-subtab-selected-bg, var(--admin-calendar-main-header-bg, #144f8c)) !important; }
@media (max-width: 620px) {
  .admin-banner-year-button-v216 { cursor: pointer; padding: .3rem .45rem !important; border: 1px solid rgba(255,255,255,.72) !important; border-radius: .55rem !important; background: rgba(255,255,255,.1) !important; }
  #changeSchoolYearButton { display: none !important; }
}
@media (max-width: 760px) {
  .schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav,
  #phonicsSubButtons.function-subnav,
  #subjectKeyStageTabsV214.function-subnav { display: none !important; }
}

/* v216.2 unified function tabs.
   Every in-page navigation tab uses the same Admin Tab and Selected Admin Tab
   branding fields as the Meal page. Keep the branding font inherited here so
   the component transfers cleanly between schools. */
.admin-body :is(
  .schoolday-function-tabs-v2162,
  #informationSubnavV136,
  #subjectKeyStageTabsV214,
  .usage-tabs,
  .public-view-tabs-v194
) {
  gap: .4rem !important;
  padding: .42rem !important;
  margin-block: .45rem .8rem !important;
  border: 1px solid var(--admin-tab-border, #b8d4ef) !important;
  border-radius: .8rem !important;
  background: color-mix(in srgb, var(--admin-tab-bg, #dceffc) 32%, var(--admin-card-bg, #fff)) !important;
  font-family: var(--schoolday-brand-font, inherit) !important;
  box-shadow: none !important;
}
.admin-body :is(
  .schoolday-function-tabs-v2162,
  #informationSubnavV136,
  #subjectKeyStageTabsV214,
  .usage-tabs,
  .public-view-tabs-v194
) > button {
  min-height: 38px !important;
  margin: 0 !important;
  padding: .48rem .72rem !important;
  border: 1px solid var(--admin-tab-border, #b8d4ef) !important;
  border-radius: .58rem !important;
  background: var(--admin-tab-bg, #dceffc) !important;
  color: var(--admin-tab-text, #111827) !important;
  font-family: var(--schoolday-brand-font, inherit) !important;
  opacity: 1 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.admin-body :is(
  .schoolday-function-tabs-v2162,
  #informationSubnavV136,
  #subjectKeyStageTabsV214,
  .usage-tabs,
  .public-view-tabs-v194
) > button:is(.active,.selected,[aria-pressed="true"],[aria-selected="true"]) {
  border-color: var(--admin-selected-tab-border, #d09a00) !important;
  background: var(--admin-selected-tab-bg, #f5c542) !important;
  color: var(--admin-selected-tab-text, #111827) !important;
}
.admin-body :is(
  .schoolday-function-tabs-v2162,
  #informationSubnavV136,
  #subjectKeyStageTabsV214,
  .usage-tabs,
  .public-view-tabs-v194
) > button:not(.active):not(.selected):not([aria-pressed="true"]):not([aria-selected="true"]):hover {
  background: color-mix(in srgb, var(--admin-tab-bg, #dceffc) 82%, var(--admin-selected-tab-bg, #f5c542)) !important;
  color: var(--admin-tab-text, #111827) !important;
}
.admin-body .pupil-workspace-tabs-v213.schoolday-function-tabs-v2162 {
  margin: 0 !important;
  padding: .5rem !important;
}
/* Retire the older v215 one-off Schedule/Resources colours with enough
   specificity to beat their inherited important rules. */
.admin-body :is(
  #phonicsSubButtons.function-subnav,
  #subjectKeyStageTabsV214.function-subnav,
  .schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav.schoolday-function-tabs-v2162
) {
  border-color: var(--admin-tab-border, #b8d4ef) !important;
  background: color-mix(in srgb, var(--admin-tab-bg, #dceffc) 32%, var(--admin-card-bg, #fff)) !important;
}
.admin-body :is(
  #phonicsSubButtons.function-subnav,
  #subjectKeyStageTabsV214.function-subnav,
  .schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav.schoolday-function-tabs-v2162
) > button {
  border-color: var(--admin-tab-border, #b8d4ef) !important;
  background: var(--admin-tab-bg, #dceffc) !important;
  color: var(--admin-tab-text, #111827) !important;
}
.admin-body :is(
  #phonicsSubButtons.function-subnav,
  #subjectKeyStageTabsV214.function-subnav,
  .schedule-manager-tabs-v214.schedule-manager-tabs-v215.function-subnav.schoolday-function-tabs-v2162
) > button:is(.active,.selected,[aria-pressed="true"],[aria-selected="true"]) {
  border-color: var(--admin-selected-tab-border, #d09a00) !important;
  background: var(--admin-selected-tab-bg, #f5c542) !important;
  color: var(--admin-selected-tab-text, #111827) !important;
}
.admin-body .floorplan-toolbar-v2161 [data-floorplan-view] {
  border-color: var(--admin-tab-border, #b8d4ef) !important;
  background: var(--admin-tab-bg, #dceffc) !important;
  color: var(--admin-tab-text, #111827) !important;
  font-family: var(--schoolday-brand-font, inherit) !important;
}
.admin-body .floorplan-toolbar-v2161 [data-floorplan-view].active {
  border-color: var(--admin-selected-tab-border, #d09a00) !important;
  background: var(--admin-selected-tab-bg, #f5c542) !important;
  color: var(--admin-selected-tab-text, #111827) !important;
}
.floorplan-empty-view-v2162 {
  display: grid;
  min-height: 100%;
  margin: 0;
  padding: 1rem;
  place-items: center;
  text-align: center;
}
