/* Atelier: shared visual treatment; business controls retain their existing hooks. */
.copy-value {
  display:inline-flex; align-items:center; gap:7px; max-width:100%; min-width:0;
  padding:4px 8px; border:0; border-radius:7px; background:var(--soft); color:var(--text);
  font:inherit; line-height:1.4; text-align:left; vertical-align:middle; text-decoration:none;
  cursor:pointer; transition:background .15s, box-shadow .15s; user-select:text;
}
.copy-value:hover { background:var(--sidebar); box-shadow:inset 0 0 0 1px var(--line); text-decoration:none; }
.copy-value:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.copy-value-text { min-width:0; overflow-wrap:anywhere; white-space:normal; }
.copy-value-icon { flex-shrink:0; opacity:.55; }
.copy-value:hover .copy-value-icon, .copy-value:focus-visible .copy-value-icon { opacity:1; }
.copy-value[data-copy-state="success"] { background:var(--good); color:var(--good-text); }
.copy-value[data-copy-state="error"] { background:var(--bad); color:var(--bad-text); }
.copy-value-status { position:fixed; z-index:10000; bottom:24px; left:50%; transform:translateX(-50%); max-width:calc(100vw - 32px); width:max-content; padding:9px 14px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--text); box-shadow:var(--shadow); font-size:13px; pointer-events:none; }
.copy-value-status[hidden] { display:none; }
@media (prefers-reduced-motion:reduce) { .copy-value { transition:none; } }
.parent-directory.panel { padding:0; overflow:hidden; }
.parent-directory-head, .parent-directory-row { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.3fr) 92px; gap:18px; padding:16px 20px; align-items:start; }
.parent-directory-head { color:var(--muted); border-bottom:1px solid var(--line); }
.parent-directory-row + .parent-directory-row { border-top:1px solid var(--line); }
.parent-directory-row:hover { background:var(--hover-overlay); }
.parent-directory-row > * { min-width:0; overflow-wrap:anywhere; }
.parent-directory-contact { display:block; margin-top:6px; overflow-wrap:anywhere; }
.parent-directory-contact small { color:var(--muted); margin-right:6px; }
.parent-directory-tasks { display:grid; gap:12px; }
.parent-directory-task { display:grid; gap:4px; min-width:0; }
.parent-directory-task a { overflow-wrap:anywhere; }
.parent-directory-task .parent-task-overdue { color:var(--bad-text); }
.parent-directory-empty { padding:20px; }
.parent-contact-section { margin:0 0 24px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.parent-contact-summary { display:flex; flex-wrap:wrap; gap:12px 24px; margin-bottom:12px; }
.parent-contact-summary .contact { display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; overflow-wrap:anywhere; min-width:0; }
.parent-contact-summary .contact > span { overflow-wrap:anywhere; min-width:0; }
.parent-contact-editor summary { color:var(--muted); width:fit-content; cursor:pointer; }
.parent-contact-form { margin-top:12px; }
.parent-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:start; }
.parent-overview > section { min-width:0; }
.parent-overview > .parent-notes { grid-column:1 / -1; }
.parent-overview .section-head { flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.parent-overview .parent-child { padding:16px; margin:0 0 12px; border:1px solid var(--line); }
.parent-overview .parent-child .section-head { margin-bottom:8px; }
.parent-overview .parent-child:last-child { margin-bottom:0; }
.parent-other { margin:9px 0; }
.parent-note-meta .link-button.danger { color:var(--bad-text); }
.parent-relationship-edit { flex:0 0 auto; margin-left:auto; color:var(--muted); white-space:nowrap; font-size:13px; }
.parent-relationship { margin:0; }
.parent-relationship .chip { white-space:normal; }
.parent-note-composer { padding:16px; margin-bottom:16px; }
.parent-note-composer textarea { display:block; width:100%; min-height:96px; resize:vertical; margin:0 0 12px; }
.parent-note-composer-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.parent-note-record { padding:16px 0; border-top:1px solid var(--line); }
.parent-note-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; margin-bottom:10px; }
.parent-note-record .parent-note { margin:0; }
.parent-note-actions { display:flex; align-items:start; gap:16px; margin-top:10px; }
.parent-note-actions > details { flex:1; min-width:0; }
.parent-note-actions summary { width:fit-content; cursor:pointer; color:var(--muted); }
.parent-note-edit { margin-top:10px; }
.parent-note-edit textarea { width:100%; margin-bottom:10px; }
.parent-notes-empty { margin:16px 0; }
.parent-overview .visually-hidden, .parent-search .visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:700px) {
  .parent-overview { grid-template-columns:minmax(0,1fr); }
  .parent-directory-head { display:none; }
  .parent-directory-row { grid-template-columns:minmax(0,1fr) 92px; gap:12px; padding:16px; }
  .parent-directory-person { grid-column:1; }
  .parent-directory-row .parent-quick-note { grid-column:2; grid-row:1; }
  .parent-directory-row .parent-list-children, .parent-directory-tasks { grid-column:1 / -1; }
  .parent-directory-row .parent-list-children { flex-direction:row; flex-wrap:wrap; gap:8px 16px; }
}
.parent-card-layout { display:grid; grid-template-columns:minmax(240px, 1fr) minmax(0, 1.7fr); gap:20px; align-items:start; }
.parent-card-layout > *, .parent-list-row > * { min-width:0; }
.parent-child + .parent-child { border-top:1px solid var(--line); margin-top:20px; padding-top:20px; }
.parent-child .section-head { align-items:flex-start; gap:12px; }
.parent-note { white-space:pre-wrap; overflow-wrap:anywhere; }
.parent-contacts strong, .parent-list .contact { overflow-wrap:anywhere; }
.parent-list-children { display:flex; flex-direction:column; gap:8px; }
.parent-search { display:flex; gap:12px; align-items:end; margin-bottom:20px; }
.parent-search .field { flex:1; min-width:0; }
.parent-search-field { position:relative; flex:1; min-width:0; }
.parent-search-field input { width:100%; padding-right:44px; }
.parent-search-field input::-webkit-search-cancel-button { -webkit-appearance:none; }
.parent-search-field .search-clear { position:absolute; right:5px; top:50%; transform:translateY(-50%); width:32px; height:32px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--muted); display:grid; place-items:center; cursor:pointer; }
.parent-search-field .search-clear:hover { background:var(--surface-alt, #edf2e8); color:var(--text); }
.parent-search-field .search-clear[hidden] { display:none; }
.parent-link-form .field { margin-bottom:16px; }
.parent-link-form .parent-primary-field { display:flex; align-items:center; gap:10px; }
.parent-primary-field input { width:auto; }
.parent-checkbox-options { max-height:250px; overflow:auto; border:1px solid var(--line); padding:12px; border-radius:12px; }
.parent-checkbox-options label { display:flex; gap:10px; align-items:flex-start; margin:8px 0; overflow-wrap:anywhere; }
.parent-checkbox-options input { width:auto; flex-shrink:0; }
[data-parent-select-picker] select { height:auto; min-height:170px; max-width:100%; }
.parent-upcoming .row { display:grid; grid-template-columns:140px minmax(0,1fr) minmax(0,1.5fr); gap:12px; }
.family-panel .family-row { flex-wrap:wrap; gap:12px; }
@media(max-width:700px) {
  .parent-card-layout { grid-template-columns:minmax(0,1fr); }
  .parent-list-row, .parent-search { flex-wrap:wrap; }
  .parent-list-children { width:100%; }
  .parent-child .section-head { flex-wrap:wrap; }
  .parent-upcoming .row { grid-template-columns:minmax(0,1fr); }
}
:root {
  color-scheme: light;
  --tabs-height: 40px;
  --bg: #f6f4eb;
  --panel: #fffef9;
  --soft: #edf2e7;
  --sidebar: #e9eee3;
  --sidebar-text: #2c3b30;
  --text: #2c3b30;
  --muted: #657060;
  --line: #d9ddcf;
  --accent: #a14f35;
  --accent-dark: #91452d;
  --accent-fill: #f0b396;
  --accent-fill-hover: #e8a684;
  --accent-text: #3d2c22;
  --good: #e8eee4;
  --good-text: #45664d;
  --warn: #f4ebd3;
  --warn-text: #85611f;
  --bad: #f5e5de;
  --bad-text: #a34f3d;
  --info: #e7eef0;
  --info-text: #4c6c7a;
  --neutral: #eaece2;
  --atelier-clay: #f7e8dd;
  --atelier-sage: #b4c5a2;
  --atelier-yellow: #e6d8a8;
  --atelier-outer: #eeeee4;
  --sidebar-hover: #dee5d6;
  --sidebar-avatar: #d0dbc4;
  --brand-sage: #73815b;
  --brand-ink: #2c3b30;
  --brand-clay-deep: #9f563e;
  --brand-ochre: #b68a36;
  --brand-clay: #b87157;
  --selected-control: #52694a;
  --selected-control-text: #fffef9;
  --atelier-heading: Georgia, 'Times New Roman', serif;
  --shadow: 0 8px 24px rgba(44, 59, 48, .09);
  --workspace-width: 980px;
  --hover-overlay: color-mix(in srgb, var(--text) 3%, transparent);
  --hover-surface: color-mix(in srgb, var(--panel) 97%, var(--text));
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #222922;
  --panel: #2c342c;
  --soft: #283027;
  --sidebar: #1a251e;
  --sidebar-text: #ebeedc;
  --text: #f2f0e6;
  --muted: #b3bdb1;
  --line: #485347;
  --accent: #f2aa8e;
  --accent-dark: #f6bca5;
  --accent-fill: #f2aa8e;
  --accent-fill-hover: #f6bca5;
  --accent-text: #382318;
  --good: #2c402f;
  --good-text: #a6d0b0;
  --warn: #443c25;
  --warn-text: #e9ba72;
  --bad: #462f2b;
  --bad-text: #e7958e;
  --info: #2c3b40;
  --info-text: #a8c6d2;
  --neutral: #3a4238;
  --atelier-clay: #46382d;
  --atelier-sage: #526d4a;
  --atelier-yellow: #74632e;
  --atelier-outer: #191f1a;
  --sidebar-hover: #2a362b;
  --sidebar-avatar: #404c42;
  --brand-sage: #afc295;
  --brand-ink: #f2f0e6;
  --brand-clay-deep: #d39477;
  --brand-ochre: #dcc176;
  --brand-clay: #e6ab8f;
  --selected-control: #1a251e;
  --selected-control-text: #ebeedc;
  --shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

body { font-family: 'Segoe UI', Arial, sans-serif; background: var(--atelier-outer); }
/* Only the lesson calendar uses the full workspace for its tiles. */
body[data-page="lessons_journal"] { --workspace-width: 100%; }

.app { --sidebar-width: 204px; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); width: calc(100% - 48px); min-height: calc(100dvh - 48px); margin: 24px auto; border: 1px solid var(--line); border-radius: 18px; background-color: var(--bg); background-image: linear-gradient(to right, var(--sidebar) var(--sidebar-width), var(--bg) var(--sidebar-width)); }
.app.no-sidebar { background-image: none; }
.page { padding: 16px 28px 28px; }
.workspace-content { width: 100%; max-width: var(--workspace-width); min-width: 0; margin-inline: auto; }
.tabstrip { max-width: 100%; margin-inline: 0; margin-bottom: 22px; }
.tab-item { border-radius: 7px 7px 0 0; font-size: 12px; background: transparent; border-color: transparent; }
.tab-item.active { background: var(--panel); border-color: var(--line); box-shadow: inset 0 2px var(--accent-fill); }
body[data-page="today"] .tabstrip { margin-bottom: 0; }

.sidebar { top: 24px; height: calc(100dvh - 48px); padding: 26px 15px 18px; gap: 27px; border-radius: 17px 0 0 17px; }
.sidebar .brand { gap: 10px; padding: 0; background: transparent; color: var(--sidebar-text); }
.brand-logo { display: block; flex: 0 0 auto; width: 58px; height: 58px; }
.brand-name { font: 400 18px/1.15 var(--atelier-heading); letter-spacing: -.3px; }
.nav-group-title { color: var(--muted); font-weight: 600; font-size: 11px; letter-spacing: .7px; }
.side-nav { gap: 18px; }
.side-nav a, .side-settings { border-radius: 9px; min-height: 41px; padding: 10px; font-size: 14px; gap: 10px; }
.nav-icon { width: 17px; height: 17px; flex-basis: 17px; }
.side-nav a[aria-current="page"] { background: var(--atelier-yellow); color: var(--text); font-weight: 500; }
.side-nav a:hover, .side-settings:hover, .theme-toggle:hover { background: var(--sidebar-hover); }
.side-nav a[aria-current="page"]:hover { background: var(--atelier-yellow); }
.side-footer { border-color: var(--line); }
.sidebar .avatar.small { background: var(--sidebar-avatar); }
.theme-toggle { display: flex; width: 100%; align-items: center; gap: 10px; min-height: 41px; padding: 10px; border: 0; border-radius: 9px; background: transparent; color: inherit; text-align: left; font-size: 13px; cursor: pointer; }
.theme-toggle .theme-sun, :root[data-theme="dark"] .theme-toggle .theme-moon { display: none; }
:root[data-theme="dark"] .theme-toggle .theme-sun { display: block; }
.side-profile { font-size: 12px; }
.side-profile small { color: var(--muted); }
.login-logo { padding: 8px; background: #fffdf8; border-radius: 14px; }

h1 { font: 400 clamp(27px, 2.3vw, 34px)/1.16 var(--atelier-heading); letter-spacing: -.7px; overflow-wrap: anywhere; }
h2 { font-size: 17px; font-weight: 500; }
h3 { font-size: 15px; font-weight: 500; }
.topbar { margin-bottom: 22px; gap: 16px 24px; align-items: center; }
.topbar > div:first-child { min-width: 0; }
.topbar .muted { margin-top: 7px; font-size: 13px; }
.eyebrow { font-size: 11px; letter-spacing: 1.2px; font-weight: 500; margin-bottom: 7px; }
.actions { gap: 7px; }
.button { border-radius: 9px; min-height: 38px; padding: 8px 12px; font-size: 13px; }
.button:hover { border-color: var(--muted); }
.button.large { min-height: 44px; }
.button.primary { background: var(--accent-fill); border-color: var(--accent-fill); }
.button.primary:hover { background: var(--accent-fill-hover); border-color: var(--accent-fill-hover); }
.button.active { background: var(--atelier-clay); color: var(--accent); border-color: var(--line); }
.button:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Quiet but persistent cue for text links that open CRM records. */
.workspace-content :is(
  a.row-title,
  a.student-name,
  a.entity-link,
  a:is([href*="/students/"], [href*="/parents/"], [href*="/groups/"], [href*="/lessons/"], [href*="/tasks/"], [href*="/sales/"]):not(.button):not(.back):not(.group-chip):not(.lesson-row):not(.tab-item):not(.plain):not(.parent-relationship-edit),
  .parent-list-children > a,
  .parent-other > a,
  .task-meta > a,
  .atelier-task-meta > a,
  .note-meta > a
) {
  text-decoration-line: underline;
  text-decoration-color: color-mix(in srgb, var(--accent) 62%, var(--accent-fill) 38%);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-skip-ink: auto;
}
.workspace-content :is(
  a.row-title,
  a.student-name,
  a.entity-link,
  a:is([href*="/students/"], [href*="/parents/"], [href*="/groups/"], [href*="/lessons/"], [href*="/tasks/"], [href*="/sales/"]):not(.button):not(.back):not(.group-chip):not(.lesson-row):not(.tab-item):not(.plain):not(.parent-relationship-edit),
  .parent-list-children > a,
  .parent-other > a,
  .task-meta > a,
  .atelier-task-meta > a,
  .note-meta > a
):hover {
  color: var(--accent-dark);
  text-decoration-color: var(--accent-dark);
  text-decoration-thickness: 1.5px;
}
/* Section tabs are navigation, even when their URL resembles a record URL. */
.workspace-content .commerce-nav a,
.workspace-content .commerce-nav a:hover {
  color: var(--text) !important;
  text-decoration: none !important;
}
.workspace-content .commerce-nav a.active,
.workspace-content .commerce-nav a.active:hover { color: var(--accent-dark) !important; }
.panel, .card { border-radius: 17px; }
.panel { padding: 20px; }
.table-panel { padding: 0; overflow-x: auto; }
/* A neutral tint keeps row hover quiet on both light and dark surfaces. */
.click-row:hover { background: var(--hover-overlay); }
.student-option:hover, .enrollment-options .enrollment-option:hover,
.family-link-results a:hover { background: var(--hover-surface); }
.section-head { gap: 10px 18px; flex-wrap: wrap; }
.section-head > div { min-width: 0; }
.section-head .muted { font-size: 12px; margin-top: 5px; }
.two-columns { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.two-columns > *, .stack > *, .field-grid > *, .form-panel, .commerce { min-width: 0; }
.form-panel, .commerce, .product-editor { max-width: 100%; }
.form-panel { padding: 24px; }
.field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field { color: var(--text); }
.field label, .field > span { font-size: 13px; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { min-width: 0; background: var(--panel); color: var(--text); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: .8; }
input:focus, select:focus, textarea:focus { outline-color: var(--accent); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--selected-control); }
textarea { line-height: 1.5; }
.form-panel > p { display: grid; gap: 6px; }
.form-panel > .button, .stack > .button { justify-self: start; }
.form-actions, .balance-actions { gap: 12px; flex-wrap: wrap; }
.form-actions > *, .balance-actions > * { max-width: 100%; }
th { text-transform: none; letter-spacing: 0; }
th, td { padding: 12px 14px; }
.group-chip { background: color-mix(in srgb, var(--group-color) 10%, var(--panel)); }
/* Grid rows stretch their items; keep the chip as wide as its label. */
.row > .group-chip { justify-self: start; }
.family-panel { width: 100%; max-width: 100%; min-width: 0; }
.family-panel .family-siblings-heading { margin: 18px 0 4px; font-size: 13px; color: var(--muted); font-weight: 500; }
.family-panel .family-sibling-row { justify-content: space-between; }
.family-panel .family-edit-link { flex-shrink: 0; color: var(--muted); font-size: 12px; }
.family-panel .family-parent-row .family-edit-link { margin-left: auto; }
.family-unlink-parents label { display: flex; align-items: center; gap: 8px; padding: 8px 0; }
.family-panel .section-head { gap: 20px; }
.family-panel .family-row { gap: 16px; }
.family-panel .family-actions { gap: 6px; flex-wrap: nowrap; }
.family-panel .family-relationship { color: inherit; text-decoration: underline dotted; text-underline-offset: 3px; }
.family-link-results a { text-decoration: none; }
.family-link-results a strong { text-decoration: underline; text-underline-offset: 3px; }
.family-panel .family-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; min-width: 36px; padding: 0; border: 0; border-radius: 50%; background: #edf1e6; color: #657558; box-shadow: none; transition: background .15s, color .15s; }
.family-panel .family-icon svg { width: 18px; height: 18px; flex-shrink: 0; }
.family-panel .family-icon-add { width: auto; gap: 5px; padding: 0 12px; border-radius: 18px; background: #f6e3d3; color: #886347; }
.family-panel .family-icon:hover { background: #e0e7d7; color: #35462d; }
.family-panel .family-icon-add:hover { background: #efd4bd; color: #68472e; }
:root[data-theme="dark"] .family-panel .family-icon { background: #354331; color: #bbcca8; }
:root[data-theme="dark"] .family-panel .family-icon-add { background: #514034; color: #edc6a6; }
:root[data-theme="dark"] .family-panel .family-icon:hover { background: #45563e; color: #d9e6ca; }
:root[data-theme="dark"] .family-panel .family-icon-add:hover { background: #654d3c; color: #ffe0c3; }
@media (pointer: coarse) { .family-panel .family-icon { width: 44px; height: 44px; min-width: 44px; } }
@media (pointer: coarse) { .family-panel .family-icon-add { width: auto; border-radius: 22px; } }
@media (prefers-reduced-motion: reduce) { .family-panel .family-icon { transition: none; } }
.family-panel .family-icon:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.parent-link-settings { margin-bottom: 16px; }
.parent-link-settings h2, .parent-link-form h2 { margin-top: 0; }
.parent-link-remove { color: var(--muted); font-size: 13px; }
.avatar.large { width: 50px; height: 50px; font-family: var(--atelier-heading); font-size: 23px; }
.student-attendance-panel, .task-context-section { margin-bottom: 18px; }
.roster-matrix { width: max-content; min-width: 100%; }
.roster-matrix th:first-child { background: var(--panel); min-width: 185px; }
.roster-matrix thead th:first-child { background: var(--soft); }
.roster-matrix th, .roster-matrix td { padding: 11px 9px; }
.attendance-matrix th:first-child { background: var(--panel); }
.attendance-legend { font-size: 12px; }

/* A compact daily workspace with all existing lesson and task actions. */
.atelier-datebar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 12px 0 14px; border-bottom: 1px solid var(--line); }
.atelier-datebar > p { color: var(--muted); font-size: 11px; text-transform: capitalize; }
.atelier-datebar .button { min-height: 30px; padding: 5px 9px; font-size: 11px; background: transparent; }
.atelier-datebar .button.active { background: var(--atelier-clay); }
.other-day .atelier-datebar > p { color: var(--text); font-size: 13px; font-weight: 600; }
.other-day .atelier-datebar > p::after { content: "не сегодня"; margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: var(--accent-fill); color: var(--accent-text); font-size: 10px; font-weight: 500; text-transform: none; letter-spacing: .3px; }
.atelier-day-return { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.atelier-welcome { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 0 28px; }
.atelier-welcome h1 { font-size: 39px; line-height: 1.13; letter-spacing: -1.4px; }
.atelier-welcome .eyebrow { margin-bottom: 7px; letter-spacing: 1.5px; font-weight: 400; }
.atelier-welcome .muted { margin-top: 10px; font-size: 13px; }
.atelier-shapes { position: relative; width: 145px; height: 110px; flex: 0 0 145px; }
.atelier-shapes span { position: absolute; display: block; }
.atelier-shapes span:nth-child(1) { left: 6px; top: 13px; width: 84px; height: 93px; border-radius: 50% 50% 6px 6px; background: var(--atelier-sage); transform: rotate(-12deg); }
.atelier-shapes span:nth-child(2) { right: 0; top: 0; width: 66px; height: 66px; border-radius: 50%; background: var(--atelier-yellow); }
.atelier-shapes span:nth-child(3) { right: 3px; bottom: 10px; width: 81px; height: 28px; border-radius: 4px 80% 30% 10px; background: var(--accent-fill); transform: rotate(-22deg); }
/* Sage greeting: confined to the Today hero, independent of the environment frame. */
.atelier-welcome.atelier-welcome-sage { margin: 22px 0 24px; padding: 28px 34px; gap: 32px; min-height: 258px; border-radius: 17px; background: var(--sidebar); }
.atelier-welcome-sage .atelier-welcome-copy { min-width: 0; }
.atelier-welcome-sage .eyebrow { color: var(--accent); margin-bottom: 12px; }
.atelier-welcome-sage h1 { font-size: 38px; line-height: 1.13; overflow-wrap: anywhere; }
.atelier-welcome-sage .muted { margin-top: 13px; }
.atelier-welcome-summary { display: flex; flex-wrap: wrap; gap: 7px 22px; margin-top: 22px; color: var(--muted); font-size: 12px; }
.atelier-birthday-summary { display: inline-flex; align-items: center; gap: 7px; flex-basis: 100%; width: fit-content; padding: 7px 10px; border-radius: 10px; background: color-mix(in srgb, var(--atelier-yellow) 35%, var(--panel)); color: var(--text); }
.atelier-birthday-summary .birthday-icon { width: 19px; height: 19px; flex: 0 0 19px; color: var(--accent); }
.atelier-birthday-summary a { color: inherit; font-weight: 600; text-underline-offset: 3px; }
/* The same SVG silhouettes inherit a quiet backdrop for each app theme. */
.atelier-welcome-art {
  --daily-art-backdrop: #f3d5bf;
  --daily-art-arch-line: #e9bea0;
  --daily-art-sun: #e4cf8e;
  --daily-art-ground: #89957a;
  --daily-art-spark: #b98c43;
  flex: 0 0 300px; width: 300px; max-width: 45%; margin: 0;
  pointer-events: none;
}
:root[data-theme="dark"] .atelier-welcome-art {
  --daily-art-backdrop: #29382c;
  --daily-art-arch-line: #3c4c38;
  --daily-art-sun: #5e5b35;
  --daily-art-ground: #59634c;
  --daily-art-spark: #bc9856;
}
.atelier-daily-art { display: block; width: 100%; height: auto; }
@media (max-width: 760px) {
  .atelier-welcome.atelier-welcome-sage { padding: 25px; gap: 20px; }
  .atelier-welcome-sage h1 { font-size: 34px; }
  .atelier-welcome-art { flex-basis: 240px; width: 240px; }
}
@media (max-width: 600px) {
  /* Keep the heading full-width, then place the summary beside the complete art.
     No absolute decoration can cover the text or crop a selected silhouette. */
  .atelier-welcome.atelier-welcome-sage {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(110px, 45%);
    align-items: center; column-gap: 8px; row-gap: 0;
    padding: 24px 22px; min-height: 0;
  }
  .atelier-welcome-sage .atelier-welcome-copy { display: contents; }
  .atelier-welcome-sage .eyebrow { grid-column: 1 / -1; font-size: 11px; }
  .atelier-welcome-sage h1 { grid-column: 1 / -1; font-size: 31px; }
  .atelier-welcome-summary {
    grid-column: 1; align-self: center; flex-direction: column;
    align-items: flex-start; gap: 6px; margin-top: 14px;
  }
  .atelier-welcome-art { grid-column: 2; width: 100%; max-width: none; margin-top: 10px; }
}
@media (max-width: 360px) {
  .atelier-welcome-sage h1 { font-size: 27px; }
  .atelier-welcome.atelier-welcome-sage { padding: 23px 20px 20px; }
}
.atelier-task-tools { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 13px; font-size:11px; }
.atelier-day-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; margin-top: 25px; font-size: 11px; color: var(--muted); }
.atelier-day-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.atelier-day-columns > section { min-width: 0; }
.atelier-day-columns .section-head { min-height: 38px; margin-bottom: 11px; gap:12px; }
.atelier-day-columns .section-head .button { flex-shrink:0; }
.atelier-day-columns .section-head h2 { font-size: 17px; font-weight: 500; }
.atelier-day-columns .section-head .muted { font-size: 11px; }
.atelier-text-link { color: var(--accent); font-size: 11px; text-decoration: none; }
.atelier-text-link:hover { text-decoration: underline; }
.atelier-day-lessons .lesson-list { gap: 11px; }
.atelier-day-lessons .lesson-row, .atelier-day-tasks .atelier-notebook { min-height: 112px; }
.atelier-day-lessons .lesson-row { grid-template-columns: 51px minmax(0, 1fr) 18px; align-items: start; gap: 13px; padding: 18px 14px; border-radius: 17px; }
.atelier-day-lessons .lesson-row:first-child { border-left: 4px solid var(--accent-fill); padding-left: 11px; }
.atelier-day-lessons .lesson-time { margin: 0; font-size: 16px; font-weight: 500; }
.atelier-day-lessons .lesson-time small { display: block; font-size: 11px; font-weight: 400; color: var(--muted); margin-top: 4px; }
.atelier-day-lessons .lesson-body { min-width: 0; }
.atelier-day-lessons .row-title { display: block; font-size: 16px; font-weight: 500; overflow-wrap: anywhere; }
.atelier-day-lessons .row-note { display: block; font-size: 12px; margin-top: 4px; }
.atelier-lesson-action { display: block; color: var(--accent); font-size: 11px; margin-top: 11px; }
.atelier-day-lessons .arrow { display: block; color: var(--muted); font-size: 15px; }
.atelier-notebook { display: grid; align-content: center; padding: 17px 16px; }
.atelier-task { display: grid; grid-template-columns: 15px minmax(0, 1fr) 16px; gap: 9px; align-items: start; padding: 13px 0; border-bottom: 1px solid var(--line); }
.atelier-task:last-child { border-bottom: 0; padding-bottom: 2px; }
.atelier-task form { padding-top: 3px; }
.atelier-task input[type="checkbox"] { display: block; width: 15px; height: 15px; margin: 0; cursor: pointer; }
.atelier-task-title { font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.atelier-task-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 7px; margin-top: 4px; color: var(--muted); font-size: 11px; }
.atelier-task-meta a, .atelier-task-title .mention { color: var(--accent); background: transparent; padding: 0; text-decoration: none; }
.atelier-task-meta a:hover { text-decoration: underline; }
.atelier-task-open { font-size: 14px; color: var(--muted); text-decoration: none; }
.atelier-task-open:hover { color: var(--accent); }
.atelier-empty-tasks { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 10px 0; text-align: center; }
.atelier-empty-tasks h2 { margin: 0; font-size: 17px; }
.atelier-empty-tasks .empty-icon svg { display: block; width: 40px; height: 40px; }
/* The two daily summaries follow the selected Sage composition. */
.atelier-day-summary { align-items: stretch; }
.atelier-day-summary > section { display: flex; flex-direction: column; }
.atelier-day-summary .lesson-list, .atelier-day-summary .atelier-notebook { flex: 1; }
.atelier-day-summary .lesson-list { align-content: start; }
.atelier-day-summary .lesson-list:has(> .empty) { display: flex; flex-direction: column; }
.atelier-day-summary .lesson-list > .empty { flex: 1; display: flex; flex-direction: column; justify-content: center; min-height: 112px; }
.atelier-day-summary .section-head { min-height: 30px; margin-bottom: 12px; }
.atelier-day-summary .section-head h2 { font-size: 15px; }
.atelier-day-summary .section-head h2 a { color: inherit; text-decoration: none; }
.atelier-day-summary .section-head h2 a:hover { text-decoration: underline; }
.atelier-day-lesson-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.atelier-day-calendar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 7px; color: var(--muted); }
.atelier-day-calendar:hover { background: var(--soft); color: var(--text); }
.atelier-day-calendar .nav-icon { width: 16px; height: 16px; }
.atelier-day-task-count { color: var(--muted); font-size: 11px; }
.atelier-day-summary .atelier-day-lessons .lesson-row { grid-template-columns: 49px minmax(0, 1fr); gap: 16px; padding: 19px 17px; border-radius: 14px; }
.atelier-day-summary .atelier-day-lessons .lesson-row:first-child { border-left-width: 3px; padding-left: 15px; }
.atelier-day-summary .atelier-day-lessons .row-title { font-size: 14px; }
.atelier-day-summary .atelier-day-lessons .row-note { margin-top: 6px; font-size: 12px; }
.atelier-day-summary .atelier-day-lessons .lesson-time { font-size: 16px; font-weight: 400; }
.atelier-day-attendance { display: block; margin-top: 7px; font-size: 11px; color: var(--good-text); }
.atelier-day-attendance.overdue { color: var(--bad-text); }
.atelier-day-attendance.muted { color: var(--muted); }
.atelier-day-summary .atelier-notebook { border-radius: 14px; padding: 19px 17px; }
.atelier-day-summary .atelier-empty-tasks { padding: 0; }
.atelier-day-summary-footer { justify-content: space-between; margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line); }
@media (pointer: coarse) {
  .atelier-day-summary .section-head { min-height: 44px; }
  .atelier-day-calendar { width: 44px; height: 44px; }
  .atelier-day-summary .section-head h2 a { display: inline-flex; align-items: center; min-height: 44px; }
}
.atelier-day-note { display: block; margin-top: 17px; padding: 17px 16px; border-radius: 17px; background: var(--atelier-clay); text-decoration: none; }
.atelier-day-note .eyebrow { font-size: 10px; font-weight: 400; margin-bottom: 8px; }
.atelier-day-note .eyebrow a { text-decoration: none; }
.atelier-day-note-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: 13px; overflow-wrap: anywhere; }
.atelier-day-note:hover { outline: 1px solid var(--accent); }
.task-column { background: var(--soft); }
.task-view-tabs .active { background: var(--atelier-yellow); color: var(--text); }
.task-column .task-row, .mention-suggestions, .mention-suggestions button, .family-link-results { background: var(--panel); }
.task-column .task-row { border-radius: 13px; }
.task-column .pagination { padding: 10px 0; }
.task-title-editor:empty::before, .task-advanced summary { color: var(--muted); }
.mention { background: var(--good); color: var(--good-text); }
.note-editor { background: var(--panel); }
.task-add:hover, .family-link-results a:hover { background: var(--hover-surface); }
.family-link-results a[aria-selected="true"] { background: var(--soft); }
.student-option mark { background: var(--atelier-yellow); }

/* Calendars and registers keep enough horizontal space for real content. */
.calendar-bar { margin-inline: 0; padding: 14px 0; background: var(--bg); backdrop-filter: none; }
.calendar-bar h1 { font-size: 30px; }
.calendar-bar .actions { max-width: 100%; }
.month-marker { font-family: var(--atelier-heading); font-size: 24px; padding-block: 9px; }
.month-cell[data-day-url] { border-radius: 12px; cursor: pointer; transition: border-color .15s, background-color .15s; }
.month-cell[data-day-url]:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent-fill, #f0b396) 8%, var(--panel)); }
a.month-day { text-decoration: none; }
a.month-day:hover, a.month-day:focus-visible { color: var(--accent-text); background: var(--accent-fill); }
.month-cell.today .month-day { color: var(--accent-text); background: var(--accent-fill); }
.month-cell-tools { display: inline-flex; align-items: center; gap: 3px; margin-left: auto; }
.month-cell-tools .day-create { margin-left: 0; }
.day-birthday { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--atelier-yellow) 34%, var(--panel)); color: var(--accent); text-decoration: none; transition: background-color .15s, transform .15s; }
.day-birthday:hover, .day-birthday:focus-visible { background: color-mix(in srgb, var(--atelier-yellow) 58%, var(--panel)); transform: translateY(-1px); }
.day-birthday .birthday-icon { width: 18px; height: 18px; }
.day-birthday-count { position: absolute; right: -2px; top: -3px; display: grid; place-items: center; min-width: 14px; height: 14px; padding: 0 3px; border-radius: 999px; background: var(--accent); color: var(--panel); font-size: 9px; font-weight: 700; line-height: 1; }
@media (min-width: 701px) and (max-width: 1100px) {
  .month-cell-tools { gap: 2px; }
  .month-cell-tools .day-create, .month-cell-tools .day-birthday { width: 21px; height: 21px; flex-basis: 21px; }
  .month-cell-tools .day-create { font-size: 16px; }
  .day-birthday .birthday-icon { width: 14px; height: 14px; }
  .month-cell-head:has(.day-birthday) .day-month { display: none; }
}
.month-lesson, .month-lesson.held, .month-lesson.canceled, .month-lesson.planned { background: color-mix(in srgb, var(--group-color) 10%, var(--panel)); }
.month-lesson.needs-review { background: var(--warn); }
.review-panel { background: var(--warn); border-color: var(--atelier-yellow); }
.lesson-heading { padding: 20px 24px; background: var(--panel); }
.lesson-heading h1 { font-size: 34px; }
.lesson-heading .lesson-time { font-size: 24px; font-weight: 500; margin: 9px 0 15px; }
.attendance-list .journal-student { grid-template-columns: minmax(155px, .8fr) minmax(0, 2fr) 168px; gap: 16px; padding: 18px; border-color: var(--line); border-left-color: var(--group-color); box-shadow: none; }
.journal-student .student-main { background: var(--soft); padding: 12px; }
.journal-student .student-name { font: 500 17px/1.35 'Segoe UI', sans-serif; }
.journal-mark { gap: 12px; padding-top: 3px; }
.journal-student-tools { grid-column: auto; }
.status-choice span { padding: 8px 10px; background: var(--panel); }
.status-choice input:checked + span { background: var(--selected-control); border-color: var(--selected-control); color: var(--selected-control-text); }
.lesson-note-panel, .lesson-student-note[open] > summary { background: var(--soft); }
.photo-dropzone { background: var(--panel); color: var(--text); border-color: #98ac91; }
.photo-dropzone:hover, .photo-dropzone.is-dragging { background: var(--good); border-color: var(--good-text); }
.photo-tile, .photo-viewer { background: var(--panel); }
.photo-tile img { background: var(--soft); }
.photo-tile.is-removed { background: var(--atelier-clay); }
.photo-pending { color: var(--good-text); }
.photo-error, .journal-save-error { background: var(--bad); color: var(--bad-text); }
.sticky-actions { background: var(--sidebar); color: var(--sidebar-text); box-shadow: var(--shadow); }
.checkout-panel { grid-template-columns: minmax(0, 1fr) 270px; border-radius: 17px; }
.checkout-main, .checkout-summary { padding: 22px; }
.checkout-summary { background: var(--soft); border-radius: 0 17px 17px 0; }
.variant-button[aria-pressed="true"] { background: var(--atelier-clay); }
.checkout-credit { background: var(--good); }
.commerce-filter { max-width: 900px; }
.commerce input, .commerce select, .commerce textarea { font-size: 14px; }
.commerce-receipt { gap: 20px; }
.narrow { margin-top: 7vh; box-shadow: var(--shadow); }

/* A short, read-only student card above the current workspace. */
html { scrollbar-gutter: stable; }
html.student-preview-open { overflow: hidden; }
.student-preview { width: min(520px, calc(100% - 32px)); max-width: 520px; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 1px solid var(--line); border-radius: 20px; background: var(--panel); color: var(--text); box-shadow: 0 22px 70px rgba(30, 44, 33, .24); }
.student-preview[open] { display: flex; flex-direction: column; }
.student-preview::backdrop { background: rgba(38, 56, 41, .36); }
.student-preview-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 19px 24px 9px; flex-shrink: 0; }
.student-preview-bar .eyebrow { margin: 0; }
.student-preview-close { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); color: var(--muted); font: 400 24px/1 'Segoe UI', sans-serif; cursor: pointer; flex-shrink: 0; }
.student-preview-close:hover { background: var(--soft); color: var(--text); }
.student-preview-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.student-preview-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 9px 24px 24px; }
.student-preview h2 { font: 400 30px/1.17 var(--atelier-heading); letter-spacing: -.6px; overflow-wrap: anywhere; }
.student-preview-identity { display: flex; align-items: center; gap: 13px; margin-bottom: 23px; }
.student-preview-identity > div { min-width: 0; }
.student-preview-identity p { font-size: 12px; margin-top: 5px; }
.student-preview-identity .avatar { width: 48px; height: 48px; font-size: 20px; }
.student-preview-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 22px; padding: 0; margin: 0 0 22px; }
.student-preview-facts dt { color: var(--muted); font-size: 12px; margin-bottom: 6px; }
.student-preview-facts dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.student-preview-facts .balance { padding: 3px 8px; }
.student-preview h3 { font-size: 13px; font-weight: 500; margin-bottom: 10px; }
.student-preview-section { margin-top: 21px; }
.student-preview-section > p { font-size: 13px; }
.student-preview-groups { display: flex; flex-wrap: wrap; gap: 6px; }
.student-preview-groups .group-chip { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.student-preview-next { padding: 15px 16px; background: var(--atelier-clay); border-radius: 12px; margin-top: 21px; }
.student-preview-next h3 { color: var(--accent); font-size: 11px; letter-spacing: .7px; text-transform: uppercase; margin-bottom: 8px; }
.student-preview-next a { font-size: 14px; text-decoration: none; }
.student-preview-next a:hover { text-decoration: underline; }
.student-preview-next p { margin-top: 5px; font-size: 12px; }
.student-preview-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; padding: 12px 0; border-top: 1px solid var(--line); font-size: 12px; overflow-wrap: anywhere; }
.student-preview-contact:last-child { padding-bottom: 0; }
.student-preview-contact > div:last-child { text-align: right; }
.student-preview-contact small { display: block; color: var(--muted); font-size: 11px; margin: 3px 0; }
.student-preview-more { font-size: 11px; color: var(--muted); margin-top: 9px; }
.student-preview-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 17px 24px 21px; border-top: 1px solid var(--line); flex-shrink: 0; }
.student-preview-message { margin: 16px 0; font-size: 13px; }

@media (max-width: 1200px) and (min-width: 901px) {
  .app { --sidebar-width: 192px; }
  .sidebar { padding-inline: 12px; }
  .page { padding-inline: 24px; }
  .atelier-day-columns { gap: 18px; }
}
@media (max-width: 1050px) {
  .atelier-day-columns { grid-template-columns: minmax(0, 1fr); }
  .attendance-list .journal-student { grid-template-columns: minmax(150px, .8fr) minmax(0, 2fr); }
  .journal-student-tools { grid-column: 2; }
}
@media (max-width: 900px) {
  .app { --sidebar-width: 76px; width: calc(100% - 24px); margin: 12px auto; min-height: calc(100dvh - 24px); }
  .sidebar { padding-inline: 10px; top: 12px; height: calc(100dvh - 24px); }
  .sidebar .brand { padding: 0; }
  .page { padding: 20px 22px 36px; }
  .two-columns { grid-template-columns: minmax(0, 1fr); }
  .brand-logo { width: 52px; height: 52px; }
  .theme-toggle { justify-content: center; padding-inline: 0; }
  .theme-toggle > span { display: none; }
  .representative-editor .contact-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .checkout-panel { grid-template-columns: minmax(0, 1fr) 240px; }
  .checkout-main, .checkout-summary { padding: 18px; }
}
@media (max-width: 760px) {
  .atelier-shapes { transform: scale(.8); transform-origin: right center; margin-right: 0; }
  .checkout-panel, .commerce-receipt { grid-template-columns: minmax(0, 1fr); }
  .checkout-summary { border-left: 0; border-top: 1px solid var(--line); border-radius: 0 0 17px 17px; }
  .field-grid { grid-template-columns: minmax(0, 1fr); }
  .form-panel { padding: 20px; }
}
@media (max-width: 700px) {
  .attendance-list .journal-student { grid-template-columns: minmax(0, 1fr); padding: 14px; gap: 12px; }
  .journal-student-tools { grid-column: 1; }
  .lesson-heading { padding: 18px; }
  .lesson-heading h1 { font-size: 29px; }
  .family-panel { width: 100%; }
  .calendar-header .calendar-bar { padding-inline: 0; }
}
@media (max-width: 600px) {
  .student-preview { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .student-preview-bar { padding: 15px 18px 8px; }
  .student-preview-body { padding: 8px 18px 20px; }
  .student-preview h2 { font-size: 27px; }
  .student-preview-footer { padding: 15px 18px; flex-direction: column-reverse; align-items: stretch; }
  .app { display: block; width: 100%; margin: 0; min-height: 100dvh; border: 0; border-radius: 0; background-image: none; }
  .sidebar { padding: 14px 12px 10px; gap: 12px; height: auto; border-radius: 0; }
  .sidebar .brand { padding: 0; justify-content: flex-start; gap: 10px; }
  .brand-name { font-size: 18px; }
  .brand-logo { width: 56px; height: 56px; }
  .page { padding: 16px 14px 30px; }
  .tabstrip { margin-bottom: 18px; }
  .sidebar .side-nav { gap: 6px; }
  .nav-group + .nav-group { padding-left: 6px; }
  .nav-group + .nav-group { border-color: var(--line); }
  .theme-toggle { width: 38px; flex: 0 0 38px; }
  .sidebar .side-nav a { min-width: 58px; }
  .topbar { align-items: stretch; }
  .topbar > form.actions { max-width: 100%; }
  .panel { padding: 16px; }
  .table-panel { padding: 0; }
  .form-panel { padding: 18px; }
  .atelier-welcome { padding: 23px 0 25px; gap: 0; }
  .atelier-welcome h1 { font-size: 31px; }
  .atelier-welcome .eyebrow { font-size: 10px; }
  .atelier-shapes { flex-basis: 88px; width: 88px; height: 86px; transform: none; }
  .atelier-shapes span:nth-child(1) { width: 52px; height: 63px; }
  .atelier-shapes span:nth-child(2) { width: 44px; height: 44px; }
  .atelier-shapes span:nth-child(3) { width: 57px; height: 20px; }
  .atelier-datebar { gap: 10px; }
  .atelier-datebar .day-nav { gap: 5px; }

  .atelier-day-lessons .lesson-row { grid-template-columns: 54px minmax(0, 1fr) 16px; padding: 15px 12px; gap: 8px 10px; }
  .atelier-day-lessons .lesson-row:first-child { padding-left: 9px; }
  .atelier-day-lessons .lesson-time { font-size: 16px; }
  .roster-matrix th:first-child { min-width: 145px; max-width: 160px; }
  .roster-matrix th, .roster-matrix td { padding: 10px 7px; }
  .filter-bar label { min-width: 0; max-width: 100%; }
  .filter-bar input, .filter-bar select { max-width: 100%; }
  .lesson-siblings { flex-wrap: wrap; }
}
@media (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px; }
  .button, .tab, .status-choice span { min-height: 44px; }
}

.lesson-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.lesson-cancel-toggle { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.lesson-cancel-help { margin: 0; max-width: 310px; font-size: 12px; line-height: 1.5; }
fieldset.journal-mark { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.journal-mark:disabled { opacity: .45; }
.signup-filters { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.signup-inbox-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 4px; border-bottom: 1px solid var(--line); color: inherit; }
.signup-inbox-summary { display: flex; flex: 1; min-width: 0; justify-content: space-between; align-items: center; gap: 20px; color: inherit; text-decoration: none; }
.signup-inbox-summary > div { min-width: 0; overflow-wrap: anywhere; }
.signup-student-link { flex-shrink: 0; }
.signup-inbox-row small { display: block; margin-top: 5px; color: var(--muted); }
.signup-answers { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 2fr); gap: 16px 24px; }
.signup-answers dt { color: var(--muted); }
.signup-answers dd { margin: 0; white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 600px) { .signup-answers { grid-template-columns: minmax(0,1fr); gap: 8px; } .signup-answers dd { margin-bottom: 14px; } .signup-inbox-row { flex-direction: column; align-items: stretch; gap: 10px; } .signup-inbox-summary { flex-direction: column; align-items: flex-start; gap: 10px; } .signup-student-link { align-self: flex-start; } }
@media (max-width: 700px) {
  .lesson-actions { align-items: flex-start; }
}

.trial-summary { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 12px; }
.trial-summary p { margin: 8px 0; }
.trial-summary-row { padding: 8px 0; overflow-wrap: anywhere; }
.trial-summary-row small { display: block; margin-top: 4px; color: var(--muted); }
.commerce-nav { flex-wrap: wrap; column-gap: 24px; row-gap: 0; }
.commerce-nav-short { display: none; }
@media (max-width: 600px) {
  /* One row on phones: short labels, smaller type, horizontal scroll instead of wrapping. */
  .commerce-nav { flex-wrap: nowrap; column-gap: 16px; overflow-x: auto; scrollbar-width: none; font-size: 13px; }
  .commerce-nav::-webkit-scrollbar { display: none; }
  .commerce-nav a { flex: 0 0 auto; white-space: nowrap; }
  .commerce-nav-full { display: none; }
  .commerce-nav-short { display: inline; }
}
.student-account-balances { display: flex; flex-wrap: wrap; gap: 16px 40px; margin-bottom: 18px; }
.student-account-balances > div, .student-account-balances > a { display: grid; gap: 6px; align-content: start; }
.student-account-balances span { color: var(--muted); font-size: 12px; }
.student-account-balances strong { font-size: 22px; font-weight: 500; }
.student-account-balances .balance-due strong { color: var(--bad-text); }
.student-account-balances a.balance-due { text-decoration: none; border-radius: 8px; }
.student-account-balances a.balance-due:hover strong, .student-account-balances a.balance-due:focus-visible strong { text-decoration: underline; text-underline-offset: 4px; }
.unpaid-panel { margin-bottom: 18px; scroll-margin-top: 96px; transition: box-shadow .25s; }
.unpaid-panel:target, .application-processing:target { box-shadow: 0 0 0 2px var(--accent); animation: unpaid-panel-pulse 1.2s ease-out; }
@keyframes unpaid-panel-pulse { 0% { box-shadow: 0 0 0 2px var(--accent), 0 0 0 10px color-mix(in srgb, var(--accent) 35%, transparent); } 100% { box-shadow: 0 0 0 2px var(--accent), 0 0 0 10px transparent; } }
/* A wallet transfer opened pre-filled from the checkout gets the same accent as the debt panel on the student card. */
.panel-highlight { scroll-margin-top: 96px; box-shadow: 0 0 0 2px var(--accent); animation: unpaid-panel-pulse 1.2s ease-out; }
.unpaid-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px 16px; }
.unpaid-amount { font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 720px) {
  .unpaid-row { grid-template-columns: auto minmax(0, 1fr); }
  .unpaid-row .unpaid-amount, .unpaid-row .button { grid-column: 2; justify-self: start; }
}

/* Compact utility actions share the workspace tab row. */
.workspace-header { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 12px; min-width: 0; min-height: var(--tabs-height); margin: -8px 0 22px; border-bottom: 1px solid var(--line); background: var(--bg); }
/* Keep the cover inside the page at rest. Opaque, rounded corners also mask
   scrolling content without painting a rectangle beyond the outer shell. */
body:has(.test-mode-frame) .page::before {
  content:""; display:block; position:sticky; top:0; z-index:29;
  height:var(--test-mode-top); margin-bottom:calc(-1 * var(--test-mode-top));
  background:
    radial-gradient(circle at 100% 100%, var(--bg) 12px, var(--atelier-outer) 12.5px) top left / 12px 12px no-repeat,
    radial-gradient(circle at 0 100%, var(--bg) 12px, var(--atelier-outer) 12.5px) top right / 12px 12px no-repeat,
    var(--bg);
  pointer-events:none;
}
.workspace-header .tabstrip { position: static; flex: 1; min-width: 0; margin: 0; border-bottom: 0; }
.workspace-header .tabstrip:empty { display: flex; }
.workspace-header .tab-item { max-width: min(220px,100%); }
.workspace-tools { display: flex; flex-shrink: 0; align-items: center; gap: 4px; margin-left: auto; }
.workspace-tool { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; padding: 0; border: 1px solid transparent; border-radius: 9px; background: transparent; color: var(--text); text-decoration: none; cursor: pointer; }
.workspace-tool:hover { background: var(--soft); color: var(--text); }
.workspace-tool[aria-current=page] { background: var(--soft); border-color: var(--line); color: var(--text); }
.workspace-tool .workspace-icon { display: block; width: 16px; height: 16px; flex: 0 0 16px; fill: currentColor; stroke: none; }
.workspace-tools [hidden] { display: none !important; }
body[data-page=today] .workspace-header { margin-bottom: 0; }
html[data-student-overlay] .workspace-header { display: none; }
@media (max-width:900px) and (min-width:601px) {
  .sidebar .chat-toggle { justify-content: center; padding: 10px; }
  .sidebar .chat-toggle > span { display: none; }
}
@media (max-width:600px) {
  /* Phone shell: the tab row is hidden, the tool row scrolls with the page,
     and the navigation row of the top bar stays pinned while the brand row
     scrolls away. Offsets are measured by ux.js. */
  .workspace-header { position: static; gap: 6px; margin-bottom: 18px; }
  .workspace-header[hidden] { display: none; }
  /* The pinned navigation row already masks the environment label area. */
  body:has(.test-mode-frame) .page::before { display: none; }
  .workspace-header .tabstrip, .workspace-header .tabstrip:empty { display: none; }
  .workspace-tools { gap: 2px; }
  .sidebar { position: sticky; top: calc(var(--test-mode-top, 0px) - var(--sidebar-nav-offset, 0px)); z-index: 31; }
  .side-nav .workspace-tools { flex: 0 0 auto; align-self: center; margin-left: auto; padding-left: 6px; border-left: 1px solid var(--line); }
  .side-nav .workspace-tool { color: var(--sidebar-text); }
  .side-nav .workspace-tool:hover { background: var(--sidebar-hover); color: var(--sidebar-text); }
  .side-nav .workspace-tool[aria-current=page] { background: var(--atelier-yellow); border-color: transparent; color: var(--text); }
}
@media (pointer:coarse) {
  .workspace-tool { width: 44px; height: 44px; }
}

/* Family portal. Scoped to its own shell; CRM continues to use Atelier. */
.portal-site { margin:0; background:#f8f7f3; color:#243b36; font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif; }
.portal-site *, .portal-staff * { box-sizing:border-box; }
.portal-site a { color:#315e50; text-underline-offset:3px; }
.portal-site h1,.portal-site h2,.portal-site h3 { color:#243b36; line-height:1.2; letter-spacing:-.025em; font-family:inherit; }
.portal-site h1 { font-size:clamp(28px,3.5vw,42px); margin:12px 0; }
.portal-site h2 { font-size:23px; margin:0 0 18px; }
.portal-site h3 { font-size:18px; margin:0 0 5px; }
.portal-site p { margin:10px 0 18px; }
.portal-header { max-width:1200px; margin:auto; padding:24px 32px; display:flex; align-items:center; gap:24px; }
.portal-brand { display:flex; gap:12px; align-items:center; text-decoration:none; font-weight:700; font-size:18px; }
.portal-brand img { flex:0 0 48px; }
.portal-brand small { display:block; font-size:12px; font-weight:500; }
.portal-label { margin-left:auto; color:#6a7972; font-size:13px; }
.portal-nav { max-width:1136px; margin:0 auto; display:flex; gap:7px; padding:8px; border:1px solid #dce3db; border-radius:16px; background:#eaf0e7; flex-wrap:wrap; }
.portal-nav a { padding:10px 20px; text-decoration:none; border-radius:10px; color:#42594f; font-size:14px; font-weight:600; }
.portal-nav a[aria-current=page] { background:#fff; box-shadow:0 2px 6px #21392b0b; color:#203d30; }
.portal-main { max-width:1200px; margin:auto; padding:40px 32px 64px; min-height:70vh; }
.portal-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:28px; }
.portal-heading p { color:#6a7972; }
.portal-eyebrow { text-transform:uppercase; letter-spacing:.09em; font-size:11px; font-weight:700; color:#6a7972; }
.portal-card,.portal-post-card { padding:26px; background:#fff; border:1px solid #e0e5dc; border-radius:18px; margin-bottom:20px; min-width:0; }
.portal-auth { max-width:500px; margin:28px auto; padding:36px; }
.portal-children { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:40px; }
.portal-child { display:flex; align-items:center; gap:16px; padding:24px; background:#f0e5dc; border:1px solid #e4d8cd; border-radius:20px; text-decoration:none; min-width:0; }
.portal-child:nth-child(even) { background:#e8eee4; border-color:#dce5d5; }
.portal-child h2 { margin:0 0 4px; }
.portal-child div>span { font-size:12px; color:#6a7972; }
.portal-child>div { min-width:0; overflow-wrap:anywhere; }
.portal-balance { margin-left:auto; text-align:right; flex-shrink:0; }
.portal-balance strong { font-size:38px; line-height:1; display:block; font-weight:650; }
.portal-balance span,.portal-balance small { display:block; }
.portal-avatar { width:48px; height:48px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#fffcf7; color:#5c7363; font-weight:700; flex-shrink:0; }
.portal-avatar.large { width:80px; height:80px; font-size:28px; background:#e6eee0; }
.portal-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; align-items:start; }
.portal-section-head { display:flex; gap:12px; justify-content:space-between; align-items:baseline; margin-bottom:18px; }
.portal-section-head h2 { margin:0; }
.portal-section-head a { font-size:12px; }
.portal-list { display:grid; gap:12px; }
.portal-lesson-row { display:flex; gap:18px; padding:20px; align-items:center; background:white; border:1px solid #e0e5dc; border-radius:16px; text-decoration:none; min-width:0; }
.portal-lesson-row>div { min-width:0; flex:1; }
.portal-lesson-row p { font-size:13px; margin:5px 0; color:#6a7972; }
.portal-lesson-row small { font-size:12px; }
.portal-date { flex:0 0 54px; font-size:11px; text-align:center; color:#6a7972; line-height:1.3; }
.portal-date strong { display:block; color:#365547; font-size:28px; font-weight:600; }
.portal-status { border-radius:20px; padding:5px 9px; background:#f0f3ed; color:#56704f; font-size:11px; max-width:150px; text-align:center; }
.portal-status.canceled,.portal-status.moved { background:#f8e6df; color:#99563f; }
.portal-post-card h3 a { text-decoration:none; }
.portal-post-card p { font-size:14px; color:#6a7972; }
.portal-post-card { margin-bottom:14px; display:flow-root; }
.portal-post-preview { float:right; width:120px; height:96px; border-radius:10px; object-fit:cover; margin:0 0 14px 18px; }
.portal-empty { border:1px dashed #cbd7c7; border-radius:16px; padding:30px; color:#6a7972; background:#f3f5ef; }
.portal-muted { font-size:13px; color:#6a7972; }
.portal-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1px solid #315e50; background:#315e50; color:#fff!important; border-radius:10px; cursor:pointer; text-decoration:none; font:600 14px/1.4 system-ui,sans-serif; }
.portal-button.secondary { color:#315e50!important; background:#f2f5ef; border-color:#d5dfcf; }
.portal-link { border:0; padding:0; background:transparent; color:#315e50; font:inherit; font-size:13px; cursor:pointer; }
.portal-site input:not([type=checkbox]):not([type=hidden]),.portal-site select,.portal-site textarea,.portal-staff input:not([type=checkbox]):not([type=hidden]),.portal-staff select,.portal-staff textarea { display:block; width:100%; max-width:100%; border:1px solid #cbd5c7; border-radius:9px; padding:11px 12px; background:#fff; color:#243b36; font:inherit; }
.portal-site label,.portal-staff label { display:block; font-size:14px; font-weight:600; margin-bottom:6px; }
.portal-site .helptext,.portal-staff .helptext { display:block; color:#6a7972; font-size:12px; margin-top:6px; }
.portal-site .errorlist { color:#a53b36; font-size:13px; padding-left:20px; }
.portal-site input[type=checkbox],.portal-staff input[type=checkbox] { accent-color:#315e50; width:18px; height:18px; }
.portal-site button:focus-visible,.portal-site a:focus-visible,.portal-site input:focus-visible,.portal-site select:focus-visible,.portal-site textarea:focus-visible { outline:3px solid #9fbb88; outline-offset:3px; }
.portal-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:24px 0; }
.portal-filters select,.portal-filters input[type=date] { width:auto!important; }
.portal-filters label { margin:0; }
.portal-check { display:flex!important; gap:8px; align-items:center; }
.portal-pagination { display:flex; justify-content:space-between; gap:20px; font-size:13px; margin:20px 0; }
.portal-feed { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.portal-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.portal-stats strong { font-size:40px; line-height:1.3; display:block; }
.portal-stats span { color:#6a7972; font-size:13px; }
.portal-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
.portal-actions form { display:flex; gap:8px; flex-wrap:wrap; }
.portal-prose { overflow-wrap:anywhere; }
.portal-media-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.portal-media { margin:0; min-width:0; }
.portal-media img,.portal-media video { display:block; width:100%; max-height:520px; border-radius:12px; object-fit:contain; background:#f2f1ed; }
.portal-media figcaption { font-size:13px; color:#6a7972; padding:8px 0; overflow-wrap:anywhere; }
.portal-comment { padding:20px 0; border-bottom:1px solid #e4e9df; margin-bottom:16px; }
.portal-comment header { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.portal-comment time { color:#6a7972; font-size:12px; }
.portal-comment details { font-size:12px; }
.portal-comment summary { cursor:pointer; color:#6a7972; }
.portal-notice { background:#e9f1e0; border:1px solid #cfddc3; padding:14px 18px; border-radius:12px; }
.portal-footer { text-align:center; color:#778474; font-size:12px; padding:20px; }
.portal-skip { position:absolute; left:16px; top:-100px; }
.portal-skip:focus { top:8px; background:white; padding:8px; z-index:10; }
.portal-photo-choice { display:flex; gap:14px; align-items:center; margin:12px 0; }
.portal-photo-choice img { width:86px; height:70px; object-fit:cover; border-radius:8px; }
@media(max-width:900px) {
  .portal-children,.portal-columns { grid-template-columns:1fr; }
  .portal-header { padding:20px; }
  .portal-nav { margin:0 20px; }
  .portal-nav a { flex:1; text-align:center; padding:10px; }
  .portal-main { padding:30px 20px; }
}
@media(max-width:540px) {
  .portal-label { display:none; }
  .portal-header form { margin-left:auto; }
  .portal-header { padding:16px; gap:12px; }
  .portal-brand { font-size:16px; }
  .portal-nav { margin:0 12px; gap:2px; padding:5px; }
  .portal-nav a { font-size:12px; flex:1 0 28%; padding:8px; }
  .portal-main { padding:26px 14px; }
  .portal-heading { align-items:flex-start; flex-direction:column; gap:8px; }
  .portal-child { padding:18px 14px; gap:12px; }
  .portal-child .portal-avatar { display:none; }
  .portal-child h2 { font-size:21px; }
  .portal-balance strong { font-size:34px; }
  .portal-balance span { font-size:10px!important; }
  .portal-child>span:last-child { display:none; }
  .portal-children { margin-bottom:28px; }
  .portal-card,.portal-post-card { padding:20px; }
  .portal-post-preview { width:92px; height:80px; margin-left:12px; }
  .portal-columns { gap:22px; }
  .portal-lesson-row { padding:15px 12px; gap:10px; display:grid; grid-template-columns:44px minmax(0,1fr); }
  .portal-lesson-row .portal-status { margin-left:0; max-width:none; grid-column:2; justify-self:start; }
  .portal-feed,.portal-media-grid { grid-template-columns:1fr; }
  .portal-stats { gap:8px; }
  .portal-stats .portal-card { padding:14px 10px; }
  .portal-stats strong { font-size:32px; }
  .portal-auth { padding:24px; margin-top:10px; }
  .portal-section-head h2 { font-size:21px; }
  .portal-pagination { gap:12px; }
}

/* Calm calendar and journal action hierarchy. */
.calendar-header { top:calc(var(--test-mode-top, 0px) + var(--workspace-header-height, var(--tabs-height))); }
@media (max-width:600px) { .calendar-header { top:calc(var(--test-mode-top, 0px) + var(--sidebar-nav-height, 0px)); } }
.calendar-header .calendar-bar { display:grid; grid-template-columns:minmax(0,1fr) minmax(160px,240px) auto; gap:12px 18px; align-items:center; padding:12px 0; }
.calendar-title-block { min-width:0; position:relative; }
.calendar-navigation { display:flex; align-items:center; flex-wrap:wrap; gap:8px 18px; }
.calendar-title-block h1 { min-width:0; margin:0; font-family:inherit; font-size:24px; }
.calendar-title-block .muted { margin:5px 0 0; font-size:12px; }
.calendar-period-toggle { display:flex; align-items:center; gap:6px; padding:3px 0; border:0; background:transparent; color:var(--text); font:inherit; font-weight:500; text-transform:capitalize; cursor:pointer; }
.calendar-period-toggle > svg { width:18px; height:18px; color:var(--muted); transition:transform .15s; }
.calendar-period-toggle[aria-expanded="true"] > svg { transform:rotate(180deg); }
.calendar-period-toggle:hover { color:var(--accent); }
.calendar-navigation svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.calendar-stepper { display:flex; align-items:center; padding:3px; gap:2px; border-radius:11px; background:var(--soft); flex:none; }
.calendar-stepper button { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--text); cursor:pointer; transition:background .15s,color .15s; }
.calendar-stepper button svg { width:18px; height:18px; }
.calendar-stepper button:hover:not(:disabled) { background:var(--panel); color:var(--accent); }
.calendar-stepper button:active:not(:disabled) { background:var(--sidebar-hover); }
.calendar-stepper button:disabled { opacity:.3; cursor:default; }
.calendar-stepper .calendar-today { position:relative; width:auto; padding-inline:12px; margin-left:5px; font:500 12px/1.2 system-ui,sans-serif; }
.calendar-today::before { content:""; position:absolute; left:-4px; top:8px; bottom:8px; border-left:1px solid var(--line); }
.calendar-period-toggle:focus-visible, .calendar-stepper button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.calendar-period-picker { position:absolute; top:calc(100% + 8px); left:0; z-index:12; width:280px; max-width:calc(100vw - 48px); display:grid; gap:14px; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:var(--shadow); }
.calendar-period-picker[hidden] { display:none; }
.calendar-period-picker input, .calendar-period-picker select { min-width:0; width:100%; max-width:none; height:40px; }
.calendar-primary-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.calendar-header .calendar-filters { display:block; min-width:0; padding:0; border:0; margin:0; }
.calendar-header .calendar-filters select { height:38px; width:100%; min-width:0; max-width:none; margin:0; padding-block:8px; font-size:12px; }
.calendar-primary-actions .button { min-height:38px; white-space:nowrap; }
@media (min-width:701px) and (max-width:1150px) {
  .calendar-header .calendar-bar { grid-template-columns:minmax(0,1fr) auto; }
  .calendar-title-block { grid-column:1 / -1; }
  .calendar-header .calendar-filters { max-width:280px; }
}
@media(pointer:coarse) {
  .calendar-stepper button { width:40px; height:40px; }
  .calendar-stepper { gap:4px; }
  .calendar-stepper .calendar-today { min-width:76px; }
  .calendar-period-toggle { min-height:44px; }
}
.crm-overflow-menu { position:relative; flex:none; margin:0; }
.crm-overflow-menu > summary { list-style:none; display:flex; align-items:center; justify-content:center; min-width:40px; cursor:pointer; }
.crm-overflow-menu > summary::-webkit-details-marker { display:none; }
.crm-overflow-menu[open] { z-index:30; }
.crm-overflow-content { position:absolute; z-index:30; right:0; top:calc(100% + 6px); width:245px; max-width:calc(100vw - 48px); padding:6px; background:var(--panel); border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px #17251920; }
.crm-overflow-content form { margin:0; }
.crm-overflow-content .crm-menu-action { display:block; width:100%; padding:10px 12px; background:transparent; border:0; border-radius:6px; text-align:left; color:var(--text); text-decoration:none; font:inherit; cursor:pointer; white-space:normal; }
.crm-overflow-content .crm-menu-action:hover { background:var(--soft); }
.crm-overflow-content .crm-menu-action.danger { color:var(--bad-text); }
.lesson-heading-organized { border:1px solid var(--line); border-left:4px solid var(--group-color); border-radius:16px; margin:18px 0 24px; padding:22px 24px; }
.lesson-heading-main { display:flex; justify-content:space-between; align-items:center; gap:20px 28px; flex-wrap:wrap; }
.lesson-heading-identity { min-width:0; }
.lesson-heading-organized .eyebrow { margin:0 0 6px; color:var(--muted); }
.lesson-heading-organized h1 { font-family:inherit; font-size:28px; margin:0; }
.lesson-heading-organized .lesson-time { font-size:20px; margin:8px 0 0; font-weight:500; }
.lesson-heading-organized .lesson-actions { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:8px; margin-left:auto; }
.lesson-heading-organized .lesson-heading-meta { display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; padding-top:15px; border-top:1px solid var(--line); margin-top:18px; font-size:13px; }
.lesson-heading-group { color:var(--text); text-decoration:none; font-weight:600; }
a.lesson-heading-group:hover { text-decoration:underline; }
.lesson-heading-state { margin-left:auto; }
.lesson-teacher-field { display:flex; align-items:center; gap:8px; min-width:0; max-width:100%; }
.lesson-teacher-field label { margin:0; font-size:13px; color:var(--muted); }
.lesson-teacher-field select { width:230px; max-width:100%; min-width:0; margin:0; padding:8px 10px; font-size:13px; }
.lesson-teacher-field .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.lesson-heading-organized .lesson-cancel-help { margin-top:12px; max-width:none; }
.event-trash-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.lesson-purge-page { max-width:740px; margin-inline:auto; }
.lesson-purge-page > .panel { margin-top:18px; }
.lesson-purge-page h1 { font:500 28px/1.3 system-ui,sans-serif; }
.lesson-purge-summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 18px; padding:18px 0; border-block:1px solid var(--line); }
.lesson-purge-summary dd { margin:0; font-variant-numeric:tabular-nums; }
.lesson-purge-check { display:flex; align-items:flex-start; gap:10px; margin:22px 0; }
.lesson-purge-check input { width:18px; height:18px; margin-top:2px; flex:none; }
.lesson-purge-page .actions { justify-content:flex-end; flex-wrap:wrap; }
@media(max-width:700px) {
  .calendar-header .calendar-bar { grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:10px 0; }
  .calendar-title-block { grid-column:1 / -1; }
  .calendar-title-block h1 { font-size:21px; }
  .calendar-navigation { justify-content:space-between; gap:8px; }
  .calendar-primary-actions .button { padding:9px 10px; white-space:nowrap; }
  .calendar-header .calendar-filters { grid-column:1; }
  .calendar-header .calendar-filters select { min-width:0; width:100%; max-width:none; }
  .lesson-heading-organized { padding:16px; }
  .lesson-heading-organized h1 { font-size:25px; }
  .lesson-heading-organized .lesson-actions { width:100%; justify-content:flex-end; }
  .lesson-heading-organized .lesson-actions > .button { flex:1 1 auto; justify-content:center; }
  .lesson-heading-organized .lesson-heading-meta { gap:8px 14px; }
  .lesson-heading-state { margin-left:0; width:100%; }
  .lesson-teacher-field { width:100%; flex-wrap:wrap; }
  .lesson-teacher-field select { flex:1 1 180px; }
}

/* Lesson materials: one composer, the same Atelier surfaces as the CRM. */
.cabinet-directory { min-width:0; }
.cabinet-directory .muted { color:var(--muted); }
.cabinet-directory h1 { font-family:inherit; font-size:30px; margin:0 0 8px; }
.cabinet-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:8px 0 28px; }
.cabinet-heading p { margin:0; }
.cabinet-heading > .button { flex:none; gap:8px; }
.cabinet-directory .panel { margin-bottom:18px; }
.cabinet-selected, .cabinet-row { display:flex; justify-content:space-between; align-items:center; gap:18px; }
.cabinet-selected > div, .cabinet-row > div { min-width:0; overflow-wrap:anywhere; }
.cabinet-row p, .cabinet-selected p { margin:6px 0 0; font-size:13px; }
.cabinet-rows.panel { padding:0; }
.cabinet-list-caption { display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin:24px 0 12px; }
.cabinet-list-caption h2 { margin:0; font:600 16px/1.4 'Segoe UI',Arial,sans-serif; }
.cabinet-list-caption h2 span { margin-left:6px; color:var(--muted); font-size:13px; font-weight:400; }
.cabinet-list-caption p { margin:0; font-size:13px; }
.cabinet-columns, .cabinet-rows > .cabinet-row { display:grid; grid-template-columns:minmax(0,1fr) 180px 244px; gap:20px; }
.cabinet-columns { padding:13px 20px; background:var(--soft); color:var(--muted); border-radius:16px 16px 0 0; font-size:12px; border-bottom:1px solid var(--line); }
.cabinet-columns > :last-child { text-align:right; }
.cabinet-row { padding:16px 20px; }
.cabinet-rows > .cabinet-row:hover { background:var(--hover-overlay); }
.cabinet-rows > .cabinet-row:last-child { border-radius:0 0 16px 16px; }
.cabinet-row + .cabinet-row { border-top:1px solid var(--line); }
.cabinet-person { display:flex; align-items:center; gap:12px; }
.cabinet-person > div { min-width:0; }
.cabinet-initial { display:flex; align-items:center; justify-content:center; flex:none; width:38px; height:38px; border-radius:50%; background:var(--soft); color:var(--good-text); font-weight:600; }
.cabinet-name { font-weight:600; line-height:1.45; }
.cabinet-status { display:inline-flex; align-items:center; gap:7px; border-radius:6px; padding:5px 8px; font-size:12px; line-height:1.4; }
.cabinet-status::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; }
.cabinet-status.is-ready { background:var(--good); color:var(--good-text); }
.cabinet-status.is-waiting { background:var(--warn); color:var(--warn-text); }
.cabinet-status.is-disabled { background:var(--bad); color:var(--bad-text); }
.cabinet-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-shrink:0; margin:0; }
.cabinet-row-actions .button { white-space:nowrap; }
.cabinet-access-menu > summary { gap:8px; background:transparent; }
.cabinet-menu-caption { padding:6px 12px 10px; border-bottom:1px solid var(--line); color:var(--muted); }
.cabinet-empty { padding:32px 24px; text-align:center; }
.cabinet-empty p { margin:8px 0 0; }
.cabinet-directory summary { cursor:pointer; }
.cabinet-search { margin:20px 0; }
.cabinet-search > div { display:flex; gap:8px; margin-top:8px; }
.cabinet-directory input:not([type=hidden]):not([type=checkbox]), .cabinet-directory select { min-width:0; width:100%; max-width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--text); font:inherit; }
.cabinet-add-access.panel { padding:0; }
.cabinet-add-access > summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 24px; list-style:none; font-size:16px; font-weight:600; }
.cabinet-add-access > summary::-webkit-details-marker { display:none; }
.cabinet-disclosure-icon { color:var(--muted); font-size:20px; transition:transform .15s; }
.cabinet-add-access[open] .cabinet-disclosure-icon { transform:rotate(180deg); }
.cabinet-add-access[open] > summary { border-bottom:1px solid var(--line); }
.cabinet-invite-body { padding:20px 24px 24px; }
.cabinet-invite-intro { max-width:700px; margin:0 0 24px; line-height:1.6; }
.cabinet-invite-form { margin:0; }
.cabinet-invite-fields { max-width:640px; }
.cabinet-invite-field { min-width:0; }
.cabinet-invite-field > label { display:block; font-size:14px; font-weight:600; margin:0 0 8px; }
.cabinet-invite-field select { display:block; min-height:44px; }
.cabinet-invite-field p { margin:8px 0 0; font-size:13px; }
.cabinet-confirmation { margin-top:24px; padding:16px; border-radius:10px; background:var(--soft); }
.cabinet-confirmation > label { display:flex; align-items:flex-start; gap:12px; margin:0; cursor:pointer; font-size:14px; line-height:1.5; }
.cabinet-confirmation input[type=checkbox] { flex:none; width:18px; height:18px; margin:2px 0 0; accent-color:var(--selected-control); }
.cabinet-confirmation small { display:block; color:var(--muted); margin-top:3px; font-size:13px; }
.cabinet-invite-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:24px; }
.cabinet-invite-footer p { margin:0; font-size:13px; }
.cabinet-invite-footer .button { min-height:44px; padding-inline:20px; }
.cabinet-form-errors { color:var(--bad-text); margin:8px 0; }
.cabinet-form-errors .errorlist { margin:0; padding-left:20px; }
.cabinet-link-result label { display:block; margin-bottom:8px; }
.cabinet-link-result input { margin-bottom:12px; }
.cabinet-pagination { display:flex; gap:16px; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:18px 0; }
@media(max-width:1100px) {
  .cabinet-columns { display:none; }
  .cabinet-rows > .cabinet-row { grid-template-columns:minmax(0,1fr) auto; gap:10px 16px; }
  .cabinet-state { grid-column:1; padding-left:50px; }
  .cabinet-row-actions { grid-column:2; grid-row:1 / 3; }
  .cabinet-list-caption { flex-wrap:wrap; }
}
@media(max-width:700px) {
  .cabinet-heading { align-items:flex-start; flex-wrap:wrap; gap:16px; }
  .cabinet-directory h1 { font-size:26px; }
  .cabinet-selected, .cabinet-row { flex-direction:column; align-items:stretch; gap:12px; }
  .cabinet-rows > .cabinet-row { grid-template-columns:minmax(0,1fr); padding:16px; }
  .cabinet-row-actions { grid-column:1; grid-row:auto; justify-content:space-between; }
  .cabinet-row-actions .button { min-height:44px; }
  .cabinet-search > div { flex-wrap:wrap; }
  .cabinet-search input { flex:1 0 100%; font-size:16px!important; }
  .cabinet-search .button { flex:1; }
  .cabinet-person { align-items:flex-start; }
  .cabinet-add-access > summary { padding:16px; }
  .cabinet-invite-body { padding:16px; }
  .cabinet-invite-field select { font-size:16px; }
  .cabinet-confirmation { padding:12px; }
  .cabinet-invite-footer { align-items:stretch; }
  .cabinet-invite-footer .button { width:100%; }
}
.materials-workspace { width:100%; min-width:0; }
.materials-workspace h1 { font-family:inherit; font-size:30px; margin:8px 0; }
.materials-heading { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:24px; }
.materials-heading p { margin:0; }
.materials-heading > div { min-width:0; }
.materials-layout { display:grid; grid-template-columns:minmax(180px,250px) minmax(0,1fr); gap:24px; align-items:start; }
.materials-layout > *, .materials-fields > * { min-width:0; }
.materials-list { display:grid; gap:8px; }
.materials-list-panel > summary { display:none; }
.materials-item { display:block; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--panel); color:var(--text); text-decoration:none; overflow-wrap:anywhere; }
.materials-item:hover { background:var(--hover-surface); }
.materials-item[aria-current=page] { background:var(--soft); border-color:var(--muted); }
.materials-item strong { display:block; font-size:15px; line-height:1.45; }
.materials-item > span, .materials-item small { display:block; margin-top:6px; font-size:12px; color:var(--muted); }
.materials-status::before { content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--muted); margin-right:5px; vertical-align:middle; }
.materials-status.is-published::before { background:var(--text); }
.materials-list-empty { padding:0 8px; }
.materials-editor-panel.panel { padding:0; margin:0; }
.materials-editor-panel > summary { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; padding:18px 24px; cursor:pointer; list-style:none; }
.materials-editor-panel > summary::-webkit-details-marker { display:none; }
.materials-editor-panel > summary::after { content:'Изменить'; margin-left:auto; font-size:13px; color:var(--muted); text-decoration:underline; text-underline-offset:4px; }
.materials-editor-panel[open] > summary::after { content:'Свернуть'; }
.materials-editor-panel[open] > summary { border-bottom:1px solid var(--line); }
.materials-editor-title { font-size:17px; font-weight:600; overflow-wrap:anywhere; }
.materials-editor-panel > summary > .muted { font-size:12px; }
.materials-editor { padding:24px; margin:0; }
.materials-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:18px; }
.materials-editor .field { display:block; margin-bottom:20px; }
.materials-editor label { display:block; font-size:14px; font-weight:600; margin-bottom:7px; }
.materials-editor input:not([type=checkbox]):not([type=hidden]):not([type=file]), .materials-editor select, .materials-editor textarea, .materials-reply textarea { display:block; width:100%; min-width:0; max-width:100%; background:var(--panel); color:var(--text); border:1px solid var(--line); border-radius:8px; padding:10px 12px; font:inherit; }
.materials-editor select:disabled { opacity:1; color:var(--muted); }
.materials-editor textarea { resize:vertical; min-height:110px; }
.materials-editor .field small { display:block; margin-top:6px; font-size:12px; line-height:1.5; }
.materials-editor .muted, .materials-workspace .muted { color:var(--muted); }
.materials-media-heading { display:flex; gap:12px; justify-content:space-between; align-items:center; margin:4px 0 12px; }
.materials-media-heading > span { font-size:12px; }
.materials-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.materials-gallery:empty { display:none; }
.materials-tile { min-width:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; position:relative; }
.materials-tile .portal-media { margin:0; }
.materials-tile img, .materials-tile video { display:block; width:100%; height:150px; max-height:150px; object-fit:contain; background:var(--soft); border-radius:0; }
.materials-tile .portal-media figcaption, .materials-file-name { display:block; color:var(--muted); font-size:12px; padding:8px 10px 0; overflow-wrap:anywhere; }
.materials-tile .materials-remove { display:flex; align-items:center; gap:7px; background:transparent; border:0; color:var(--muted); font-size:12px; font-weight:400; padding:8px 10px; margin:0; cursor:pointer; }
.materials-tile.is-removed img, .materials-tile.is-removed video { opacity:.35; }
.materials-drop { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; position:relative; padding:16px; margin-top:12px; border:1px dashed var(--line); border-radius:10px; }
.materials-drop > .button { margin:0; font-weight:500; cursor:pointer; }
.materials-drop > span, .materials-drop > small { font-size:12px; }
.materials-drop > small { width:100%; }
.materials-drop.is-dragover { background:var(--soft); border-color:var(--text); }
.materials-file-input { position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; }
.materials-drop:focus-within { outline:2px solid var(--muted); outline-offset:2px; }
.materials-journal { margin:18px 0; }
.materials-journal summary, .materials-discussion summary { cursor:pointer; font-weight:500; }
.materials-journal .materials-gallery { margin-top:14px; }
.materials-photo-option { overflow:hidden; border:1px solid var(--line); border-radius:10px; cursor:pointer; }
.materials-photo-option[hidden] { display:none; }
.materials-photo-option img { display:block; width:100%; height:120px; object-fit:cover; }
.materials-photo-option > span { display:flex; gap:8px; align-items:center; padding:10px; overflow-wrap:anywhere; font-size:12px; font-weight:400; }
.materials-photo-option:has(input:checked) { outline:2px solid var(--text); }
.materials-editor input[type=checkbox] { width:16px; height:16px; flex-shrink:0; margin:0; accent-color:var(--text); }
.materials-editor .materials-comments-check { display:flex; gap:8px; align-items:center; font-weight:400; margin:20px 0; }
.materials-savebar { border-top:1px solid var(--line); padding-top:18px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.materials-savebar > span { font-size:12px; }
.materials-save-actions { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; margin-left:auto; }
.materials-save-actions [value=draft] { order:-1; }
.materials-errors, .materials-workspace .errorlist { color:var(--danger,#9f3434); font-size:14px; }
.materials-errors:empty { display:none; }
.materials-discussion.panel { margin-top:18px; padding:20px 24px; }
.materials-comment { padding:16px 0; border-bottom:1px solid var(--line); }
.materials-comment > div:first-child { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.materials-comment time { font-size:12px; }
.materials-reply { margin:18px 0; }
.materials-reply label { display:block; margin-bottom:8px; }
.materials-moderation { display:inline-block; font-size:13px; margin-top:18px; }
@media(max-width:1050px) { .materials-fields { grid-template-columns:minmax(0,1fr); gap:0; } .materials-layout { grid-template-columns:190px minmax(0,1fr); gap:18px; } }
@media(max-width:700px) {
  .materials-heading { align-items:flex-start; flex-wrap:wrap; gap:12px; }
  .materials-heading .button { margin-left:auto; }
  .materials-workspace h1 { font-size:26px; }
  .materials-layout { grid-template-columns:minmax(0,1fr); gap:16px; }
  .materials-list { grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
  .materials-list-panel > summary { display:list-item; cursor:pointer; padding:12px 14px; background:var(--soft); border-radius:10px; overflow-wrap:anywhere; }
  .materials-list-panel[open] .materials-list { margin-top:10px; }
  .materials-item { padding:12px; }
  .materials-editor, .materials-discussion.panel { padding:16px; }
  .materials-editor-panel > summary { padding:14px 16px; }
  .materials-savebar { align-items:stretch; }
  .materials-save-actions { width:100%; }
  .materials-save-actions .button { flex:1; white-space:normal; }
  .materials-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .materials-tile img, .materials-tile video { height:125px; }
  .materials-drop { padding:12px; }
}

/* Family cabinet preview keeps the employee session and shows its scope. */
.portal-preview-banner { max-width: 1136px; margin: 0 auto 20px; padding: 18px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fff1d4; color: #574324; border: 1px solid #d6bb81; border-radius: 16px; }
.portal-preview-banner p { margin: 6px 0 0; font-size: 14px; }
.portal-preview-banner form { flex-shrink: 0; }
.cabinet-selected form { display: flex; flex-wrap: wrap; gap: 8px; }
.cabinet-row-actions { flex-wrap: wrap; }
@media (max-width: 700px) { .portal-preview-banner { margin: 0 16px 16px; padding: 16px; flex-direction: column; align-items: flex-start; } }

/* Personal invitations and recoverable workspace forms. */
.portal-invitation { padding:24px; margin:0 0 28px; border:1px solid var(--line); border-radius:16px; background:var(--surface, #fff); }
.portal-invitation h2 { margin:0 0 8px; font-size:21px; }
.portal-invitation p { color:var(--muted); }
.referral-url { overflow-wrap:anywhere; user-select:all; font-size:14px; line-height:1.6; color:var(--text); margin:8px 0 16px; }
.referral-copy-fallback { width:100%; box-sizing:border-box; min-height:100px; margin-top:12px; }
.portal-invitation-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.portal-invitation [data-referral-copy-status]:empty { display:none; }
.workspace-draft-note { display:flex; align-items:center; flex-wrap:wrap; gap:10px; color:var(--muted); font-size:13px; }
@media(max-width:600px) { .portal-invitation { padding:18px; } }

/* Focused cabinet access opened from a person card. */
.cabinet-person-access { max-width:800px; margin-inline:auto; }
.cabinet-access-nav { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-bottom:24px; }
.cabinet-person-access .cabinet-selected { flex-direction:column; align-items:stretch; }
.cabinet-person-access .cabinet-selected form { margin:0; }
.cabinet-person-access .cabinet-link-result { overflow-wrap:anywhere; }
.cabinet-credentials { margin-top:20px; }
.cabinet-credentials h2 { margin-top:0; }
.cabinet-credentials > label, .cabinet-password-result > label { display:block; margin:16px 0 8px; }
.cabinet-credentials input, .cabinet-credentials textarea { width:100%; min-width:0; box-sizing:border-box; }
.cabinet-credentials input[readonly] { margin-bottom:12px; }
.cabinet-password-result { margin-top:20px; padding:16px; border-radius:12px; background:var(--soft); }
.cabinet-password-form { margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
.cabinet-password-form > summary { cursor:pointer; font-weight:600; }
.cabinet-password-form form { margin:16px 0 0; }
.cabinet-copy-fallback:not([hidden]) { display:block; min-height:120px; margin-top:12px; }

/* Sidebar notifications and application pricing. */
.nav-alert-row { display: flex; align-items: center; gap: 2px; border-radius: 9px; min-width: 0; }
.nav-alert-row:has(> a[aria-current="page"]) { background: var(--atelier-yellow); }
.side-nav .nav-alert-row > a { flex: 1 1 auto; min-width: 0; padding-right: 2px; }
.nav-counts { display: flex; flex: 0 0 auto; align-items: center; gap: 2px; padding-right: 3px; }
.sidebar .side-nav .nav-badge { display: inline-flex; flex-direction: row; justify-content: center; flex: 0 0 auto; width: auto; min-width: 18px; min-height: 21px; padding: 2px 4px; border-radius: 6px; font-size: 11px; font-weight: 500; line-height: 17px; font-variant-numeric: tabular-nums; }
.badge-yellow { --status-surface: var(--warn); --status-ink: var(--warn-text); }
.badge-red { --status-surface: var(--bad); --status-ink: var(--bad-text); }
.badge-blue { --status-surface: var(--info); --status-ink: var(--info-text); }
.badge-yellow, .badge-red, .badge-blue,
.side-nav .badge-yellow, .side-nav .badge-red, .side-nav .badge-blue { background: var(--status-surface); color: var(--status-ink); }
.side-nav .nav-badge:hover { box-shadow: inset 0 0 0 1px var(--status-ink); }
.side-nav .nav-badge[hidden] { display: none; }
.student-alert-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.student-alert-filters .button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; max-width: 100%; background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: 9px; font-weight: 400; white-space: normal; }
.student-alert-filters .button:hover { background: var(--hover-surface); border-color: var(--muted); }
.student-alert-filters [aria-current="page"] { border-color: var(--text); box-shadow: inset 0 -2px var(--text); }
.student-alert-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--status-ink); }
.student-alert-count { min-width: 22px; padding: 1px 5px; border-radius: 6px; background: var(--status-surface); color: var(--status-ink); text-align: center; font-variant-numeric: tabular-nums; }
.student-alert-filters .is-empty { color: var(--muted); }
.student-alert-filters .is-empty .student-alert-dot { opacity: .45; }
.student-alert-filters .is-empty .student-alert-count { background: transparent; color: var(--muted); }
.balance.caution { background: var(--warn); color: var(--warn-text); }
.balance.neutral { background: var(--neutral); color: var(--muted); }
/* Message text stays neutral; the leading edge carries its semantic color. */
.messages .message { --message-ink: var(--info-text); background: var(--panel); color: var(--text); border: 1px solid var(--line); border-left: 3px solid var(--message-ink); border-radius: 10px; padding: 12px 16px; overflow-wrap: anywhere; }
.messages .message.success { --message-ink: var(--good-text); }
.messages .message.warning { --message-ink: var(--warn-text); }
.messages .message.error { --message-ink: var(--bad-text); }

/* Tasks created from student and application alerts. */
.alert-task-action { display: grid; justify-items: start; gap: 5px; min-width: 0; max-width: 270px; white-space: normal; }
.alert-task-action + .alert-task-action { margin-top: 12px; }
.alert-task-action small { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; margin: 0; }
.button.alert-task-create { padding-inline: 10px; border-radius: 7px; background: transparent; font-weight: 400; transition: border-color .15s ease, background-color .15s ease; }
.button.alert-task-create:hover, .button.alert-task-create:focus-visible { border-color: var(--muted); background: var(--hover-surface); }
@media (prefers-reduced-motion: reduce) {
  .button.alert-task-create { transition: none; }
}
.alert-task-link { font-size: 13px; font-weight: 500; text-decoration: none; }
.alert-task-link:hover { text-decoration: underline; }
.alert-task-link.overdue { color: var(--bad-text); }
.signup-task-action { flex: 0 1 auto; }
.alert-task-context { margin-bottom: 18px; }
.alert-task-page { width: 100%; max-width: 780px; margin: 0 auto; }
.alert-task-form { min-width: 0; }
.alert-task-fields { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, .7fr); gap: 16px; }
.alert-task-fields > .field { min-width: 0; }
.alert-task-form input, .alert-task-form select, .alert-task-form textarea { width: 100%; min-width: 0; max-width: 100%; }
@media (max-width: 600px) {
  .alert-task-fields { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}
/* Directory tabs leave each existing list and its filters intact. */
.parent-nav { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 22px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.workspace-content .parent-nav a,
.workspace-content .parent-nav a:hover { padding: 8px 12px; border: 1px solid transparent; border-radius: 8px; color: var(--text) !important; text-decoration: none !important; }
.workspace-content .parent-nav a:hover { background: var(--soft); }
.workspace-content .parent-nav a[aria-current="page"] { background: var(--panel); border-color: var(--line); font-weight: 600; }
.trial-quote { justify-content: center; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.trial-quote strong { font-size: 23px; font-variant-numeric: tabular-nums; }
.trial-quote small { color: var(--muted); }
.application-processing { scroll-margin-top: 96px; transition: box-shadow .25s; }
.application-processing h2 { margin-bottom: 18px; }
.application-processing .field-grid { align-items: start; }
.application-processing [hidden] { display: none; }
.application-processing .field { align-content: start; }
.application-processing .field input, .application-processing .field select { width: 100%; height: 40px; box-sizing: border-box; }
.application-processing .trial-quote { text-align: center; }
.application-processing .application-actions { margin-top: 4px; }
.application-actions { justify-content: flex-start; flex-wrap: wrap; }
.application-actions .primary { margin-left: auto; }
@media (max-width: 900px) {
  .nav-alert-row { flex-direction: column; }
  .nav-counts { flex-wrap: wrap; justify-content: center; padding: 0 0 4px; }
  .nav-alert-row > a { width: 100%; }
}
@media (max-width: 600px) {
  .nav-alert-row { flex: 0 0 auto; flex-direction: row; align-items: flex-start; min-width: 68px; }
  .side-nav .nav-alert-row > a { flex: 0 0 auto; width: auto; }
  .nav-counts { align-self: flex-start; flex-wrap: nowrap; margin-left: -12px; padding: 4px 3px 0 0; }
  .application-actions .primary { margin-left: 0; }
  .application-actions > .button { width: 100%; }
}

/* Atelier entrance: shared CRM branding, with a dedicated family welcome page. */
.login-card .login-brand { display:flex; align-items:center; justify-content:center; gap:10px; color:var(--text); margin:0 0 28px; }
.login-card .login-brand .brand-name { display:block; font:400 18px/1.15 var(--atelier-heading); letter-spacing:-.3px; }
.login-card .login-brand .brand-logo { width:58px; height:58px; }
.portal-brand { gap:10px; color:var(--text); }
.portal-site .portal-brand { color:var(--text); }
.portal-brand .brand-name { font:400 18px/1.15 var(--atelier-heading); letter-spacing:-.3px; }
.portal-site.portal-login-page { background:var(--bg); color:var(--text); min-height:100dvh; display:flex; flex-direction:column; }
.portal-login-page .portal-header { width:100%; max-width:1192px; margin:0 auto; padding:32px 36px; }
.portal-login-page .portal-label { color:var(--muted); font-size:12px; letter-spacing:.04em; }
.portal-login-page .portal-main { width:100%; max-width:1192px; min-height:0; margin:0 auto; padding:24px 36px 40px; flex:1; display:flex; flex-direction:column; justify-content:center; }
.portal-login-page .portal-footer { padding:12px 24px 28px; color:var(--muted); font-size:12px; text-align:center; }
.portal-welcome { display:grid; grid-template-columns:1.06fr 1fr; border:1px solid var(--line); border-radius:24px; overflow:hidden; background:var(--panel); box-shadow:0 18px 60px #2c3b3009; }
.portal-welcome-story { position:relative; background:var(--sidebar); padding:44px 44px 26px; min-width:0; display:flex; flex-direction:column; }
.portal-welcome-kicker { display:block; color:var(--muted); font-size:10px; line-height:1.5; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.portal-site .portal-welcome-title { font:400 clamp(38px,3.4vw,50px)/1.12 var(--atelier-heading); letter-spacing:-1.7px; margin:24px 0 4px; color:var(--text); }
.portal-welcome-title em { color:var(--accent); font-weight:400; }
.portal-welcome-art { display:block; width:100%; max-width:440px; margin:auto auto 0; }
.portal-welcome-art img { display:block; width:100%; height:auto; aspect-ratio:480/300; }
.portal-site .portal-welcome-caption { font-size:12px; letter-spacing:.07em; color:var(--muted); margin:8px 0 0; }
.portal-welcome-form { padding:62px 52px 36px; min-width:0; align-self:center; }
.portal-site .portal-welcome-form h1 { font:400 clamp(30px,2.8vw,40px)/1.15 var(--atelier-heading); letter-spacing:-1px; color:var(--text); margin:16px 0; }
.portal-site .portal-welcome-intro { color:var(--muted); font-size:14px; line-height:1.7; margin:0 0 30px; }
.atelier-login-form { display:grid; gap:20px; }
.portal-site .atelier-login-field label { display:block; color:var(--text); font-size:13px; font-weight:500; margin-bottom:8px; }
.portal-site.portal-login-page .atelier-login-field input { display:block; width:100%; min-height:52px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--text); padding:12px 14px; font:inherit; font-size:16px; transition:border-color .15s,box-shadow .15s; }
.portal-site.portal-login-page .atelier-login-field input:focus { border-color:var(--brand-sage); outline:2px solid var(--atelier-sage); outline-offset:2px; }
.atelier-password-wrap { position:relative; }
.portal-site.portal-login-page .atelier-password-wrap:has(.atelier-password-toggle:not([hidden])) input { padding-right:96px; }
.atelier-password-toggle { position:absolute; right:8px; top:6px; min-height:40px; padding:0 10px; border:0; border-radius:6px; font:inherit; font-size:12px; color:var(--muted); background:transparent; cursor:pointer; }
.atelier-password-toggle[hidden] { display:none; }
.atelier-password-toggle:hover { color:var(--text); background:var(--soft); }
.atelier-login-submit { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:54px; margin-top:4px; padding:14px 20px; border:1px solid transparent; border-radius:10px; background:var(--accent-fill); color:var(--accent-text); font:500 14px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif; cursor:pointer; transition:background .15s,transform .15s; }
.atelier-login-submit span { font-size:21px; line-height:1; }
.atelier-login-submit:hover { background:var(--accent-fill-hover); transform:translateY(-1px); }
.atelier-login-submit:active { transform:translateY(0); }
.atelier-login-help { margin-top:22px; font-size:12px; color:var(--muted); }
.atelier-login-help summary { width:fit-content; max-width:100%; padding:4px 0; cursor:pointer; text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:5px; }
.atelier-login-help summary::marker { font-size:9px; }
.atelier-login-help summary:hover { color:var(--text); }
.portal-site .atelier-login-help p { margin:10px 0 0; line-height:1.7; }
.portal-site .atelier-login-note { margin:32px 0 0; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font:italic 15px/1.5 var(--atelier-heading); }
.atelier-login-error { padding:12px 14px; border:1px solid var(--bad-text); border-radius:10px; background:var(--bad); color:var(--bad-text); }
.portal-site .atelier-login-error .errorlist { list-style:none; padding:0; margin:0; color:inherit; }
.portal-site .atelier-login-field .errorlist { margin:8px 0 0; padding-left:16px; color:var(--bad-text); }
.portal-login-page :is(button,summary,a):focus-visible { outline:2px solid var(--brand-sage); outline-offset:4px; }
@media (max-width:900px) {
  .portal-login-page .portal-header { padding:24px; }
  .portal-login-page .portal-main { padding:16px 24px 32px; }
  .portal-welcome-story { padding:34px 28px 24px; }
  .portal-site .portal-welcome-title { font-size:38px; }
  .portal-welcome-form { padding:40px 28px 30px; }
}
@media (max-width:680px) {
  .portal-login-page .portal-header { padding:22px 24px 18px; gap:16px; }
  .portal-login-page .portal-label { display:none; }
  .portal-login-page .portal-main { padding:4px 16px 24px; justify-content:flex-start; flex:0 0 auto; }
  .portal-welcome { display:block; border-radius:20px; }
  .portal-welcome-story { display:none; }
  .portal-welcome-form { padding:28px 24px; width:100%; }
  .portal-site .portal-welcome-form h1 { font-size:clamp(26px,8vw,32px); margin:12px 0 28px; }
  .portal-site .portal-welcome-intro, .portal-site .atelier-login-note { display:none; }
  .atelier-login-form { gap:18px; }
  .atelier-login-help { margin-top:18px; }
  .portal-login-page .portal-footer { font-size:11px; padding:0 24px 20px; }
}
@media (prefers-reduced-motion:reduce) {
  .atelier-login-submit, .portal-site.portal-login-page .atelier-login-field input { transition:none; }
  .atelier-login-submit:hover { transform:none; }
}

/* Entity headers: deliberately scoped to leave journals, balances and forms alone. */
.topbar.card-header {
  border:1px solid var(--line); border-left:4px solid var(--card-stripe, var(--brand-sage));
  border-radius:16px; background:var(--panel); padding:22px 24px; margin:18px 0 24px;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px 24px;
}
.card-header > :first-child { min-width:0; max-width:100%; }
.topbar.card-header > div:first-child { flex:1 1 220px; }
.topbar.card-header h1 { font-family:inherit; font-weight:500; font-size:26px; overflow-wrap:anywhere; margin:0; }
.topbar.card-header .eyebrow { margin:0 0 6px; color:var(--muted); }
.topbar.card-header .muted { margin:7px 0 0; }
.topbar.card-header .avatar { flex:none; border-radius:14px; }
.card-header .card-header-actions { display:flex; position:relative; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px; margin-left:auto; flex:0 1 auto; }
.card-action-icon { display:block; width:18px; height:18px; flex:0 0 18px; }
.card-header .button.card-icon-button, .student-preview-tools .button.card-icon-button {
  display:inline-flex; align-items:center; justify-content:center; width:38px; min-width:38px; height:38px;
  padding:8px; border:1px solid transparent; border-radius:9px; box-shadow:none;
  background:transparent; color:var(--muted); flex:0 0 38px; font-size:14px; line-height:1;
}
.card-header .button.card-icon-button:hover, .student-preview-tools .button.card-icon-button:hover,
.card-header .card-header-menu[open] > summary { background:var(--soft); color:var(--text); }
.card-header .button.card-icon-button.primary { background:var(--accent-fill); color:var(--accent-text); }
.card-header .button.card-icon-button.danger:hover { background:var(--bad); color:var(--bad-text); }
.card-header .card-header-form { display:contents; }
.card-header .button.card-icon-button.primary:hover { background:var(--accent-fill-hover); }
.card-header .button.card-icon-button:disabled { opacity:.45; cursor:not-allowed; }
.card-header .card-primary-action { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:38px; border-radius:9px; white-space:normal; text-align:center; }
.card-header .card-header-menu { position:static; }
.card-header .crm-overflow-content { max-width:min(280px, calc(100vw - 64px)); width:280px; }
.card-header .crm-overflow-content .crm-menu-action { display:flex; align-items:center; gap:10px; font-size:13px; }
.card-header .crm-overflow-content .crm-menu-action[hidden] { display:none; }
.card-header .crm-overflow-content .danger { color:var(--bad-text); }
.card-header .crm-overflow-content .danger:not(:first-child) { border-top:1px solid var(--line); margin-top:5px; border-radius:0 0 6px 6px; }
.card-action-tooltip {
  position:fixed; z-index:10000; pointer-events:none; max-width:calc(100vw - 16px);
  padding:7px 10px; border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow);
  background:var(--panel); color:var(--text); font:12px/1.4 system-ui,sans-serif;
}
.card-primary-action .label-short { display:none; }
@media(max-width:700px) {
  .topbar.card-header { padding:18px 16px; gap:16px; }
  .topbar.card-header h1 { font-size:23px; }
  /* The column layout of .topbar turns the 220px flex basis into height; reset it. */
  .topbar.card-header { align-items:stretch; }
  .topbar.card-header > div:first-child { flex:0 0 auto; }
  /* Short primary label keeps the icon row and the button on one line. */
  .card-primary-action .label-full { display:none; }
  .card-primary-action .label-short { display:inline; }
  .card-header .card-header-actions { max-width:100%; }
  .card-header .crm-overflow-content { max-width:calc(100vw - 96px); }
  .lesson-heading-organized.card-header .lesson-actions > .card-icon-button { flex:0 0 38px; }
}
@media(pointer:coarse) {
  .card-header .button.card-icon-button, .student-preview-tools .button.card-icon-button,
  .lesson-heading-organized.card-header .lesson-actions > .card-icon-button { min-width:44px; width:44px; height:44px; flex:0 0 44px; }
}

/* Shared contact editor, including nested representatives in the student form. */
.parent-editor .parent-editor-section + .parent-editor-section { border-top:1px solid var(--line); margin-top:24px; padding-top:22px; }
.parent-editor .parent-editor-section h2 { font-family:inherit; font-size:17px; font-weight:500; line-height:1.3; margin:0 0 16px; }
.parent-editor .parent-editor-section > .field { margin:0; }
.parent-editor-help { font-size:12px; margin:22px 0 0; max-width:720px; }
.parent-editor .form-actions { justify-content:flex-end; gap:8px; }
.parent-editor-section > .field input { width:100%; }
.contact-editor { min-width:0; }
.contact-editor .contact-editor-row {
  display:grid; grid-template-columns:122px minmax(120px,1fr) auto 36px;
  gap:10px 12px; align-items:end; padding:14px 0; border-bottom:1px solid var(--line);
}
.contact-editor .contact-editor-row:first-child { padding-top:0; }
.contact-editor-row > input[type=hidden], .contact-editor-row > [hidden] { display:none; }
.contact-editor .contact-editor-row .field { margin:0; min-width:0; }
.contact-editor-row .field > span { color:var(--muted); font-size:12px; }
.contact-editor-row input:not([type=checkbox]), .contact-editor-row select { width:100%; min-width:0; margin:0; }
.contact-editor-row .contact-primary { display:flex; align-items:center; gap:7px; height:40px; margin:0; white-space:nowrap; font-size:12px; }
.contact-primary input[type=checkbox] { width:16px; height:16px; flex:0 0 16px; margin:0; }
.contact-editor .contact-remove, .representative-editor .representative-remove { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:8px; border:0; background:transparent; color:var(--muted); border-radius:8px; }
.contact-editor .contact-remove:hover, .representative-editor .representative-remove:hover { background:var(--bad); color:var(--bad-text); }
.contact-editor .contact-note, .contact-editor .contact-errors { grid-column:1 / -1; }
.contact-note summary, .representative-note summary { display:flex; align-items:center; gap:7px; width:fit-content; color:var(--muted); font-size:12px; cursor:pointer; list-style:none; }
.contact-note summary::-webkit-details-marker, .representative-note summary::-webkit-details-marker { display:none; }
.contact-note summary::after, .representative-note summary::after { content:'⌄'; margin-left:3px; }
.contact-note[open] summary::after, .representative-note[open] summary::after { content:'⌃'; }
.contact-note .card-action-icon, .representative-note .card-action-icon { width:15px; height:15px; flex-basis:15px; }
.contact-note > .field, .representative-note > .field { margin:10px 0 0; }
.representative-note textarea { display:block; width:100%; min-height:76px; resize:vertical; }
.contact-editor .contact-add { display:inline-flex; align-items:center; gap:6px; margin-top:12px; }
.contact-empty { margin:8px 0 0; font-size:13px; }
.contact-editor:has(> [data-contact-rows] > [data-contact-row]:not([hidden])) > .contact-empty { display:none; }
.representative-editor { border:1px solid var(--line); border-radius:14px; background:var(--panel); padding:16px 18px; margin:14px 0; }
.representative-editor-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:-5px 0 10px; font-size:12px; color:var(--muted); }
.representative-editor > .field-grid { margin-bottom:18px; }
.representative-editor > .representative-note, .parent-editor-section > .representative-note { margin-top:16px; }
.contact-editor [data-contact-row][hidden], [data-representative][hidden] { display:none; }
.contact-editor .visually-hidden, .representative-note .visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:620px) {
  .contact-editor .contact-editor-row { grid-template-columns:minmax(0,1fr) 36px; gap:10px; }
  .contact-editor-row .contact-kind { grid-column:1; grid-row:1; }
  .contact-editor-row .contact-remove { grid-column:2; grid-row:1; }
  .contact-editor-row .contact-value { grid-column:1 / -1; grid-row:2; }
  .contact-editor-row .contact-primary { grid-column:1 / -1; grid-row:3; height:32px; }
  .representative-editor { padding:14px; }
  .representative-editor > .field-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
}

/* Family Atelier: shared CRM palette, with a bounded family workspace. */
.portal-site.portal-atelier { background:var(--atelier-outer); color:var(--text); font:15px/1.55 'Segoe UI',system-ui,sans-serif; }
.portal-atelier :is(h1,h2,h3) { color:var(--text); font-family:inherit; font-weight:500; overflow-wrap:anywhere; }
.portal-atelier h1 { font-size:clamp(27px,3vw,36px); letter-spacing:-.035em; }
.portal-atelier h2 { font-size:22px; letter-spacing:-.025em; }
.portal-atelier h3 { font-size:18px; }
.portal-atelier a { color:var(--selected-control); }
.portal-atelier .portal-app { display:grid; grid-template-columns:204px minmax(0,1fr); width:calc(100% - 48px); min-height:calc(100dvh - 48px); margin:24px auto; border:1px solid var(--line); border-radius:18px; background:linear-gradient(to right,var(--sidebar) 204px,var(--bg) 204px); align-items:start; }
.portal-atelier .portal-workspace { min-width:0; }
.portal-atelier .portal-sidebar { display:flex; flex-direction:column; gap:30px; position:sticky; top:24px; min-height:calc(100dvh - 50px); padding:26px 15px 18px; }
.portal-atelier .portal-brand { gap:10px; padding:0; color:var(--text); font-size:15px; font-weight:500; }
.portal-atelier .portal-brand .brand-logo { width:54px; height:54px; flex:0 0 54px; }
.portal-atelier .portal-side-nav { display:grid; gap:6px; }
.portal-atelier :is(.portal-side-nav,.portal-mobile-menu nav) .portal-referral-nav { margin-top:12px; padding:13px 10px; background:color-mix(in srgb,var(--accent-fill) 15%,var(--sidebar)); color:var(--text); border:1px solid color-mix(in srgb,var(--line) 80%,var(--accent-fill)); }
.portal-atelier :is(.portal-side-nav,.portal-mobile-menu nav) .portal-referral-nav:hover { background:color-mix(in srgb,var(--accent-fill) 25%,var(--panel)); }
.portal-atelier :is(.portal-side-nav,.portal-mobile-menu nav) .portal-referral-nav[aria-current=page] { background:color-mix(in srgb,var(--accent-fill) 30%,var(--panel)); color:var(--text); border-color:var(--line); box-shadow:none; }
.portal-atelier .portal-referral-nav small { display:block; font-size:11px; margin-top:3px; color:var(--muted); }
.portal-atelier .portal-referral-nav[aria-current=page] small { color:var(--muted); }
.portal-atelier .portal-bonus-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start; }
.portal-atelier .portal-bonus-steps .portal-card { margin-bottom:0; }
.portal-atelier .portal-bonus-steps h3 { margin-top:12px; }
.portal-atelier .portal-bonus-amount { display:block; margin:16px 0 10px; color:var(--selected-control); font-size:30px; font-weight:500; }
.portal-atelier .portal-bonus-group { border-top:1px solid var(--line); margin-top:22px; padding-top:6px; }
.portal-atelier .portal-bonus-group small { color:var(--muted); }
.portal-atelier .portal-referral-benefits { margin-bottom:24px; }
.portal-atelier .portal-referral-benefits .portal-notice { margin-top:18px; }
.portal-atelier .portal-referral-benefits .portal-notice p { margin-bottom:0; }
@media(max-width:800px) { .portal-atelier .portal-mobile-menu .portal-referral-nav { margin-top:0; grid-column:1/-1; } }
@media(max-width:600px) { .portal-atelier .portal-bonus-steps { grid-template-columns:minmax(0,1fr); } }
.portal-atelier :is(.portal-side-nav,.portal-mobile-menu nav) a { display:flex; align-items:center; gap:10px; padding:12px; border-radius:10px; color:var(--muted); text-decoration:none; min-width:0; }
.portal-atelier :is(.portal-side-nav,.portal-mobile-menu nav) a[aria-current=page] { color:var(--text); background:var(--panel); }
.portal-atelier .nav-icon { width:18px; height:18px; flex:0 0 18px; }
.portal-atelier .portal-sidebar-bottom { margin-top:auto; padding-top:32px; }
.portal-atelier .portal-sidebar-logout { margin:10px 0 0; }
.portal-atelier .portal-sidebar-logout .portal-button { width:100%; }
.portal-atelier .portal-header form { flex-shrink:0; }
.portal-atelier .portal-sidebar-note { border-top:1px solid var(--line); padding:16px 10px 0; color:var(--muted); font-size:12px; }
.portal-atelier .portal-profile-link { display:flex; align-items:center; gap:10px; padding:10px; border-radius:10px; color:var(--text); text-decoration:none; overflow-wrap:anywhere; }
.portal-atelier .portal-profile-link > span:last-child { min-width:0; }
.portal-atelier .portal-profile-link small { display:block; color:var(--muted); font-size:12px; }
.portal-atelier .portal-profile-link[aria-current=page] { background:var(--panel); }
.portal-atelier .portal-header { max-width:none; min-height:73px; padding:20px 28px; border-bottom:1px solid var(--line); justify-content:space-between; }
.portal-atelier .portal-header > .portal-brand { display:none; }
.portal-atelier .portal-label { margin:0; color:var(--muted); font-size:14px; }
.portal-atelier .portal-header form { margin:0; }
.portal-atelier .portal-content-wrap { width:100%; max-width:1036px; margin-inline:auto; padding-inline:28px; }
.portal-atelier .portal-main { width:100%; max-width:980px; min-height:0; padding:28px 0 36px; margin:0 auto; }
.portal-atelier .portal-child-switcher { display:flex; align-items:center; gap:7px; flex-wrap:wrap; padding-top:20px; }
.portal-atelier .portal-child-switcher a { color:var(--muted); padding:8px 12px; border:1px solid transparent; border-radius:24px; text-decoration:none; overflow-wrap:anywhere; }
.portal-atelier .portal-child-switcher a[aria-current=true] { background:var(--panel); color:var(--text); border-color:var(--line); }
.portal-atelier .portal-mobile-menu { display:none; }
.portal-atelier .portal-heading { align-items:flex-start; margin-bottom:24px; }
.portal-atelier .portal-heading p { color:var(--muted); margin-bottom:0; }
.portal-atelier .portal-eyebrow { color:var(--muted); font-size:12px; font-weight:400; text-transform:none; letter-spacing:.015em; }
.portal-atelier :is(.portal-card,.portal-post-card) { background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:22px; }
.portal-atelier .portal-card :last-child { margin-bottom:0; }
.portal-atelier .portal-button { background:var(--accent-fill); border-color:var(--accent-fill); color:var(--accent-text)!important; font-weight:500; }
.portal-atelier .portal-button:hover { background:var(--accent-fill-hover); }
.portal-atelier .portal-button.secondary { color:var(--text)!important; background:var(--panel); border-color:var(--line); }
.portal-atelier .portal-button.secondary:hover { background:var(--soft); }
.portal-atelier button:disabled { opacity:.55; cursor:default; }
.portal-atelier .portal-link { color:var(--selected-control); }
.portal-atelier :is(.portal-muted,.portal-post-card p,.portal-stats span,.portal-comment time,.portal-media figcaption,.helptext) { color:var(--muted); }
.portal-atelier .portal-invitation { display:block; background:var(--atelier-clay); border:1px solid var(--line); border-radius:18px; padding:22px; margin:0 0 22px; }
.portal-atelier .portal-invitation p { margin:10px 0 16px; }
.portal-atelier .portal-invitation .referral-url { color:var(--text); user-select:text; overflow-wrap:anywhere; word-break:break-word; }
.portal-atelier .portal-invitation-actions { display:flex; flex-wrap:wrap; gap:10px; }
.portal-atelier [data-referral-copy-status]:empty { display:none; }
.portal-atelier .referral-copy-fallback { margin-top:14px; }
.portal-atelier .portal-next { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px; background:var(--soft); border-radius:18px; margin-bottom:26px; }
.portal-atelier .portal-next > div { min-width:0; }
.portal-atelier .portal-next .portal-button { flex-shrink:0; }
.portal-atelier .portal-next h2 { margin:10px 0 16px; }
.portal-atelier .portal-next-details { display:flex; align-items:center; gap:16px; }
.portal-atelier .portal-next-details > div { min-width:0; }
.portal-atelier .portal-next-details p { margin:4px 0; }
.portal-atelier .portal-next-details .portal-status { display:block; width:fit-content; margin-top:7px; }
.portal-atelier .portal-home-section { margin-bottom:26px; }
.portal-atelier .portal-section-head { flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:16px; }
.portal-atelier .portal-section-head a { font-size:13px; }
.portal-atelier .portal-children { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:0; }
.portal-atelier .portal-child { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-content:start; gap:12px; padding:20px; background:var(--panel); border-color:var(--line); border-radius:18px; }
.portal-atelier .portal-child:nth-child(even) { background:var(--panel); border-color:var(--line); }
.portal-atelier .portal-child:hover { border-color:var(--brand-sage); }
.portal-atelier .portal-child-name h3 { margin:0 0 3px; }
.portal-atelier .portal-child div > span { font-size:13px; color:var(--muted); }
.portal-atelier .portal-avatar { background:var(--atelier-clay); color:var(--selected-control); font-weight:500; width:40px; height:40px; }
.portal-atelier .portal-avatar.large { width:72px; height:72px; }
.portal-atelier .portal-balance { display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; grid-column:1/-1; margin:3px 0 0; padding-top:14px; border-top:1px solid var(--line); text-align:left; }
.portal-atelier .portal-balance strong { display:inline; font-size:20px; font-weight:500; }
.portal-atelier .portal-balance span { display:inline; font-size:14px!important; }
.portal-atelier .portal-balance small { width:100%; color:var(--muted); }
.portal-atelier .portal-balance-notice { grid-column:1/-1; background:var(--warn); color:var(--warn-text); padding:8px 10px; border-radius:8px; }
.portal-atelier .portal-feed { align-items:start; gap:20px; }
.portal-atelier .portal-post-card { display:flex; flex-direction:column; padding:0; margin:0 0 20px; align-self:start; }
.portal-atelier .portal-feed .portal-post-card { margin:0; }
.portal-atelier .portal-post-cover { display:block; background:var(--atelier-clay); border-radius:17px 17px 0 0; }
.portal-atelier .portal-post-preview { display:block; float:none; width:100%; height:220px; max-height:220px; margin:0; border-radius:17px 17px 0 0; object-fit:cover; }
.portal-atelier .portal-post-copy { padding:22px; min-width:0; overflow-wrap:anywhere; }
.portal-atelier .portal-post-copy h3 { margin-top:9px; }
.portal-atelier .portal-post-copy p { margin:10px 0 18px; }
.portal-atelier .portal-feed > .portal-empty { grid-column:1/-1; }
.portal-atelier .portal-lesson-row { background:var(--panel); border-color:var(--line); }
.portal-atelier .portal-lesson-row:hover { background:var(--soft); }
.portal-atelier .portal-lesson-row p { color:var(--muted); }
.portal-atelier .portal-date { color:var(--muted); background:var(--bg); padding:10px 6px; border-radius:10px; }
.portal-atelier .portal-date strong { color:var(--text); font-size:24px; font-weight:500; }
.portal-atelier .portal-status { background:var(--soft); color:var(--good-text); border-radius:7px; font-size:12px; }
.portal-atelier .portal-status.canceled,.portal-atelier .portal-status.moved { background:var(--warn); color:var(--warn-text); }
.portal-atelier .portal-empty { background:var(--panel); color:var(--muted); border:1px solid var(--line); padding:30px; }
.portal-atelier .portal-notice { background:var(--soft); border-color:var(--line); color:var(--text); }
.portal-atelier :is(input:not([type=checkbox]):not([type=hidden]),select,textarea) { background:var(--panel); color:var(--text); border-color:var(--line); font-size:16px; }
.portal-atelier input[type=checkbox] { accent-color:var(--selected-control); }
.portal-atelier label { font-weight:500; }
.portal-atelier .errorlist { color:var(--bad-text); }
.portal-atelier :is(button,a,input,select,textarea):focus-visible { outline:2px solid var(--brand-sage); outline-offset:3px; }
.portal-atelier .portal-filters { gap:10px; margin:20px 0; }
.portal-atelier .portal-filters :is(input[type=date],select) { max-width:100%; }
.portal-atelier .portal-pagination { flex-wrap:wrap; }
.portal-atelier .portal-stats { background:var(--panel); border:1px solid var(--line); border-radius:18px; gap:0; margin:24px 0; }
.portal-atelier .portal-stats .portal-card { margin:0; border:0; border-radius:0; background:transparent; }
.portal-atelier .portal-stats .portal-card + .portal-card { border-left:1px solid var(--line); }
.portal-atelier .portal-stats strong { font-size:32px; font-weight:500; }
.portal-atelier .portal-media-grid { align-items:start; }
.portal-atelier .portal-media img,.portal-atelier .portal-media video { height:auto; max-height:420px; background:var(--bg); }
.portal-atelier .portal-comment { border-color:var(--line); }
.portal-atelier .portal-comment header { justify-content:space-between; }
.portal-atelier .portal-comment summary { color:var(--muted); }
.portal-atelier .portal-footer { display:flex; flex-wrap:wrap; gap:10px 20px; justify-content:space-between; text-align:left; padding:18px 0; border-top:1px solid var(--line); color:var(--muted); }
.portal-atelier .portal-preview-banner { margin:20px 28px 0; max-width:none; background:var(--warn); color:var(--warn-text); border-color:var(--line); }
.portal-atelier .portal-app-public { display:block; background:var(--bg); }
.portal-atelier.portal-public .portal-header > .portal-brand { display:flex; }
.portal-atelier.portal-public .portal-content-wrap { max-width:1036px; }
@media(max-width:1100px) {
  .portal-atelier .portal-columns { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:800px) {
  .portal-atelier .portal-app { display:block; width:calc(100% - 24px); margin:12px auto; min-height:calc(100dvh - 24px); background:var(--bg); }
  .portal-atelier .portal-sidebar { display:none; }
  .portal-atelier .portal-header { padding:16px 18px; gap:12px; }
  .portal-atelier .portal-header > .portal-brand { display:flex; }
  .portal-atelier .portal-label { display:none; }
  .portal-atelier .portal-content-wrap { padding-inline:18px; }
  .portal-atelier .portal-mobile-menu { display:block; position:sticky; top:0; z-index:20; background:var(--sidebar); border-bottom:1px solid var(--line); }
  .portal-atelier .portal-mobile-menu summary { cursor:pointer; min-height:44px; padding:12px 18px; color:var(--text); }
  .portal-atelier .portal-mobile-menu nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:0 12px 12px; }
  .portal-atelier .portal-main { padding-top:24px; }
  .portal-atelier .portal-preview-banner { margin:16px 18px; }
}
@media(max-width:540px) {
  .portal-atelier .portal-app { width:100%; margin:0; min-height:100dvh; border:0; border-radius:0; }
  .portal-atelier .portal-content-wrap { padding-inline:16px; }
  .portal-atelier .portal-child-switcher a { padding:8px 10px; font-size:13px; }
  .portal-atelier .portal-children,.portal-atelier .portal-feed { grid-template-columns:minmax(0,1fr); }
  .portal-atelier .portal-next { flex-direction:column; align-items:flex-start; padding:20px; gap:16px; }
  .portal-atelier .portal-child { padding:18px; }
  .portal-atelier .portal-child .portal-avatar { display:inline-flex; }
  .portal-atelier .portal-child-arrow { display:inline; }
  .portal-atelier .portal-card,.portal-atelier .portal-invitation { padding:20px; }
  .portal-atelier .portal-post-card { padding:0; }
  .portal-atelier .portal-post-copy { padding:18px; }
  .portal-atelier .portal-post-preview { height:190px; max-height:190px; }
  .portal-atelier .portal-invitation-actions { flex-direction:column; align-items:stretch; }
  .portal-atelier .portal-stats { grid-template-columns:minmax(0,1fr); }
  .portal-atelier .portal-stats .portal-card { display:flex; align-items:baseline; gap:14px; padding:14px 18px; }
  .portal-atelier .portal-stats .portal-card + .portal-card { border-left:0; border-top:1px solid var(--line); }
  .portal-atelier .portal-heading { gap:14px; }
  .portal-atelier .portal-filters { align-items:stretch; }
  .portal-atelier .portal-filters :is(select,input[type=date]) { width:100%!important; min-width:0; }
}

/* Employee action journal */
.audit-page .audit-filters { margin-top: 0; }
.audit-page .audit-list { padding: 0; }
.audit-row { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 6px 16px; padding: 12px 18px; border-bottom: 1px solid var(--line); }
.audit-row:last-child { border-bottom: 0; }
.audit-when { font-size: 12px; color: var(--muted); line-height: 1.35; }
.audit-when strong { color: var(--text); font-weight: 600; }
.audit-body { min-width: 0; display: grid; gap: 4px; }
.audit-body p { margin: 0; }
.audit-head { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.audit-actor a { text-decoration: none; }
.audit-summary { overflow-wrap: anywhere; }
.audit-links { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; }
.audit-changes { display: grid; gap: 2px; margin: 4px 0 0; padding: 8px 12px; border-left: 3px solid var(--line); font-size: 13px; }
.audit-changes > div { display: grid; grid-template-columns: minmax(120px, 200px) minmax(0, 1fr); gap: 10px; }
.audit-changes dt { color: var(--muted); }
.audit-changes dd { margin: 0; overflow-wrap: anywhere; }
.audit-changes s { color: var(--muted); }
.audit-meta { font-size: 12px; overflow-wrap: anywhere; }
@media (max-width: 640px) { .audit-row { grid-template-columns: 1fr; } .audit-changes > div { grid-template-columns: 1fr; } }
.inviter-editor { margin-top: 6px; }
.inviter-editor summary { cursor: pointer; color: var(--accent, inherit); }
.inviter-form { margin-top: 10px; max-width: 560px; }

/* Family bonuses use the existing 980px cabinet content column. */
.portal-atelier .portal-home-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-bottom:26px; }
.portal-atelier .portal-home-overview > .portal-home-section { display:flex; flex-direction:column; min-width:0; margin:0; }
.portal-atelier .portal-home-overview .portal-section-head { flex-shrink:0; }
.portal-atelier .portal-home-overview .portal-children { grid-template-columns:minmax(0,1fr); flex:1; }
.portal-atelier .portal-home-overview .portal-child { align-content:stretch; grid-template-rows:auto 1fr; }
.portal-atelier .portal-home-overview .portal-balance { align-self:end; }
.portal-atelier .portal-bonus-card { display:flex; flex-direction:column; align-items:flex-start; flex:1; padding:20px; background:var(--soft); border:1px solid var(--line); border-radius:18px; }
.portal-atelier .portal-bonus-value { display:block; margin:5px 0; font-size:36px; font-weight:500; line-height:1.2; letter-spacing:-.03em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.portal-atelier .portal-bonus-value > span { font-size:20px; font-weight:400; letter-spacing:0; }
.portal-atelier .portal-bonus-card p,.portal-atelier .portal-bonus-summary p { margin:5px 0 0; font-size:13px; }
.portal-atelier .portal-bonus-link { margin-top:16px; color:var(--accent); font-size:13px; }
.portal-atelier .portal-home-overview-many { grid-template-columns:minmax(0,1fr) minmax(250px,.7fr); align-items:start; }
.portal-atelier .portal-bonus-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; padding:24px; margin-bottom:22px; background:var(--soft); border:1px solid var(--line); border-radius:18px; }
.portal-atelier .portal-bonus-summary > div { min-width:0; }
.portal-atelier .portal-bonus-summary > div + div { padding-left:24px; border-left:1px solid var(--line); }
.portal-atelier .portal-bonus-history { border-top:1px solid var(--line); }
.portal-atelier .portal-bonus-entry { border-bottom:1px solid var(--line); padding:14px 0; }
.portal-atelier .portal-bonus-entry summary { display:flex; justify-content:space-between; align-items:center; gap:16px; list-style:none; cursor:pointer; min-height:44px; }
.portal-atelier .portal-bonus-entry summary::-webkit-details-marker { display:none; }
.portal-atelier .portal-bonus-entry summary > span:first-child { min-width:0; overflow-wrap:anywhere; }
.portal-atelier .portal-bonus-entry small { display:block; margin-top:4px; font-size:12px; color:var(--muted); }
.portal-atelier .portal-bonus-delta { flex-shrink:0; color:var(--good-text); font-variant-numeric:tabular-nums; text-align:right; }
.portal-atelier .portal-bonus-delta.returned { color:var(--muted); }
.portal-atelier .portal-bonus-entry > p { margin:12px 0 0; padding:10px 12px; background:var(--panel); border-radius:8px; font-size:13px; }
@media(max-width:700px) {
  .portal-atelier .portal-home-overview { grid-template-columns:minmax(0,1fr); }
  .portal-atelier .portal-home-bonuses { grid-row:1; }
  .portal-atelier .portal-home-bonuses .portal-section-head { display:none; }
  .portal-atelier .portal-bonus-summary { grid-template-columns:minmax(0,1fr); gap:18px; padding:20px; }
  .portal-atelier .portal-bonus-summary > div + div { padding:18px 0 0; border-left:0; border-top:1px solid var(--line); }
  .portal-atelier .portal-bonus-entry summary { flex-wrap:wrap; gap:8px 14px; }
}