@import url("pde-resource-inline-attributes.css");
:root {
	--ink: #17324d;
	--muted: #71839b;
	--line: #e4edf5;
	--surface: #fff;
	--soft: #f5fafc;
	--brand: #0798b3;
	--brand-dark: #078ca6;
	--shadow: 0 2px 10px rgba(23,50,77, .045);
	--radius: 20px;
	--block-gap: 9px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: #f5fafc; }
body {
	margin: 0;
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 13px;
	color: var(--ink);
	background: #f5fafc;
}
button, input, select { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }
svg { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.app { width: min(1680px, 100%); margin: 0 auto; padding: 10px clamp(8px, 1.4vw, 20px) 18px; }
.app-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 0;
	padding: 9px 12px;
	border: 0;
	border-bottom: 1px solid var(--line);
	border-left: 0;
	border-radius: 0;
	background: rgba(255, 255, 255, .94);
	box-shadow: none;
}
.app-header__identity, .app-header__actions, .card__head, .timetable-card__head, .modal__head, .modal__actions { display: flex; align-items: center; }
.app-header__identity { min-width: 0; gap: 10px; }
.app-header__mark {
	display: grid;
	place-items: center;
	flex: 0 0 38px;
	height: 38px;
	border-radius: 50%;
	color: var(--brand);
	background: #eaf9fc;
}
.app-header__mark svg { width: 21px; height: 21px; }
.app-header h1 { overflow: hidden; margin: 1px 0 0; font-size: clamp(16px, 1.65vw, 22px); white-space: nowrap; text-overflow: ellipsis; }
.schedule-selector { display: inline-flex; min-width: 0; }
.schedule-selector select { min-height: 34px; max-width: 190px; padding: 6px 28px 6px 9px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: #fff; font-size: 12px; font-weight: 700; }
.eyebrow { margin: 0; color: var(--brand-dark); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.app-header__actions { gap: 7px; }

.button, .icon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 34px;
	border: 0;
	border-radius: 11px;
	font-weight: 700;
	cursor: pointer;
	transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.button { padding: 7px 11px; }
.button:hover, .icon-button:hover { transform: translateY(-1px); }
.button:focus-visible, .icon-button:focus-visible, .subject-chip:focus-visible, .slot:focus-visible { outline: 3px solid rgba(18, 149, 173, .24); outline-offset: 2px; }
.button--primary { color: #fff; background: var(--brand); box-shadow: 0 4px 12px rgba(18, 149, 173, .2); }
.button--primary:hover { background: var(--brand-dark); }
.button--soft { color: #334155; background: #edf2f7; }
.button--danger { color: #b4233a; background: #fff0f2; }
.icon-button { width: 30px; min-height: 30px; padding: 0; border: 1px solid var(--line); background: #fff; font-size: 19px; }
.save-status { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 7px; border-radius: 11px; color: #b4233a; background: #fff0f2; }
.save-status__icon { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.save-status.is-saving { color: #b4233a; background: #fff0f2; }
.save-status.is-saving .save-status__icon { animation: pulse 1s infinite; }
.save-status.pde-inline-loading .save-status__icon { display: none; }
.save-status.is-saved { color: #16834a; background: #eaf8f0; }
.save-status.is-error { color: #b4233a; background: #fff0f2; }
@keyframes pulse { 50% { opacity: .35; } }

.workspace { display: grid; width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr); align-items: start; gap: var(--block-gap); }
.card { border: 1px solid rgba(203, 213, 225, .78); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.control-panel { width: 100%; min-width: 0; overflow: hidden; }
.control-panel__tools { display: grid; width: 100%; min-width: 0; }
.subject-card, .totals-card { width: 100%; min-width: 0; padding: 12px; }
.subject-card { border-top: 1px solid var(--line); }
.official-hours-link { display: inline-flex; align-items: center; min-height: 24px; margin-top: 0; padding: 3px 6px; border: 1px solid color-mix(in srgb, #7a4fd0 35%, white); border-radius: 8px; color: #6339b5; background: color-mix(in srgb, #7a4fd0 8%, white); font-size: 8px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.official-hours-link:hover { background: color-mix(in srgb, #7a4fd0 14%, white); }
.app-header__identity { min-width: 0; }
.app-header__identity .app-header__mark { display: none; }
.app-header__identity:empty { display: none; }
.button--danger svg { width: 1.15em; height: 1.15em; stroke-width: 1.9; }
.totals-card { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 14px; }
.totals-card__overview { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.totals-card__heading { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 5px 6px; }
.totals-card__heading h2 { margin: 0; font-size: 13px; }
.totals-card__icon { display: inline-grid; flex: 0 0 18px; place-items: center; width: 18px; height: 18px; color: #527ba3; }
.totals-card__icon svg { width: 17px; height: 17px; stroke-width: 1.8; }
.subject-card { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 8px; }
.subjects { grid-column: 1 / -1; }
.schedule-workspace { display: grid; width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr) minmax(245px, 300px); align-items: stretch; gap: var(--block-gap); }
.timetable-card { min-width: 0; }
.card__head { justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.card h2 { margin: 1px 0 0; font-size: 15px; }
.compact-hint, .grid-help { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.compact-hint { margin-bottom: 8px; }

.subjects { display: grid; grid-column: 1 / -1; grid-template-columns: calc((100% - 44px) / 12) repeat(auto-fit, minmax(46px, 1fr)); gap: 4px; padding: 0; overflow: visible; }
.subject-chip {
	position: relative;
	display: grid;
	grid-template-rows: 24px minmax(0, 1fr);
	place-items: center;
	gap: 2px;
	width: 100%;
	min-width: 0;
	height: 52px;
	padding: 4px 3px 3px;
	border: 1px solid var(--line);
	border: 1px solid var(--subject-color);
	border-radius: 9px;
	background: #fff;
	box-shadow: 0 1px 4px rgba(15, 23, 42, .04);
	text-align: center;
	cursor: pointer;
	touch-action: none;
	user-select: none;
	transition: background .14s ease, border-color .14s ease, transform .14s ease;
}
.subject-chip:hover { transform: translateY(-1px); }
.subject-chip.is-selected { border-color: var(--subject-color); background: color-mix(in srgb, var(--subject-color) 8%, white); box-shadow: 0 0 0 2px color-mix(in srgb, var(--subject-color) 18%, transparent); }
.subject-chip--level { display: flex; flex-direction: column; gap: 2px; padding: 3px; background: #f8fafc; cursor: default; touch-action: auto; }
.subject-chip--level:hover { transform: none; }
.school-type__option { flex: 1; min-height: 0; width: 100%; padding: 2px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font: inherit; font-size: 7.5px; font-weight: 700; line-height: 1; cursor: pointer; }
.school-type__option.is-active { color: #fff; background: var(--brand); }
.subject-chip__icon { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--subject-color); background: color-mix(in srgb, var(--subject-color) 11%, white); font-weight: 800; }
.subject-chip__icon svg { width: 15px; height: 15px; stroke-width: 1.8; }
.subject-chip__text { min-width: 0; width: 100%; }
.subject-chip__text strong { display: -webkit-box; overflow: hidden; font-size: 8.5px; line-height: 1.08; white-space: normal; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.subject-chip__text small { color: var(--muted); font-size: 9px; }

.timetable-card { min-width: 0; overflow: hidden; border-color: #dce4ec; border-radius: 18px; box-shadow: 0 8px 24px rgba(15, 23, 42, .07); }
.timetable-card__head { justify-content: space-between; gap: 8px; min-height: 42px; padding: 7px 10px; border-bottom: 1px solid var(--line); }
.week-summary { color: #334155; font-size: 10px; font-weight: 700; }
.legend { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 9px; }
.legend span { display: inline-flex; align-items: center; gap: 4px; }
.legend i { display: inline-block; width: 9px; height: 9px; border-radius: 3px; }
.legend__dot { background: var(--brand); }
.legend__break { background: #e5e9ee; }
.legend__lunch { background: #dce2e8; }
.schedule-scroll { max-width: 100%; height: auto; max-height: none; padding-bottom: 10px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; }
.schedule-grid { position: relative; display: grid; min-width: 632px; isolation: isolate; background: #fff; }
.grid-corner, .day-header { position: sticky; top: 0; z-index: 7; display: grid; place-items: center; border-right: 1px solid #dce4ec; border-bottom: 1px solid #d5dee8; }
.grid-corner { left: 0; z-index: 9; background: linear-gradient(135deg, #fbfcfe, #f5f8fb); }
.day-header { gap: 2px; padding: 7px 5px 6px; color: var(--day-color); background: color-mix(in srgb, var(--day-color) 7%, white); font-size: 12px; font-weight: 800; }
.day-header__title { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.day-header__title svg { width: 17px; height: 17px; stroke-width: 1.9; }
.day-header__title strong { font-size: 12px; line-height: 1; }
.day-header small { display: block; margin-top: 1px; color: #415169; font-size: 8px; font-weight: 600; }
.day-header.is-nonworking { color: #7b8797; background: #f1f4f7; }
.day-header.is-nonworking small { color: #98a3b2; }
.time-label {
	position: sticky;
	left: 0;
	z-index: 5;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 3px 2px;
	border-right: 1px solid #d5dee8;
	border-bottom: 1px solid #e8edf2;
	color: #334155;
	background: #fbfcfe;
	font-size: 9px;
	font-weight: 650;
	white-space: nowrap;
}
.time-label__time { font-size: 8.5px; font-variant-numeric: tabular-nums; text-align: center; }
.time-label--recess { color: #6740ad; background: #faf8ff; }
.time-label--lunch { color: #258244; background: #f7fbf7; }
.slot { z-index: 1; min-width: 0; padding: 0; border: 0; border-right: 1px solid #e3e9ef; border-bottom: 1px dashed #e8edf2; background: #fff; cursor: crosshair; }
.slot:nth-of-type(2n) { border-bottom-color: #dde5ed; }
.slot:hover { z-index: 2; background: rgba(18, 149, 173, .09); }
.slot.is-drop-target { z-index: 3; background: rgba(18, 149, 173, .2); box-shadow: inset 0 0 0 2px var(--brand); }
.slot.is-unavailable { background: #f5f7f9; border-bottom-color: #edf1f4; cursor: not-allowed; }
.slot.is-unavailable:hover { background: #f5f7f9; }
.slot.is-recess { background: linear-gradient(90deg, #faf8ff, #f5f1fc); border-bottom-color: #ebe4f7; cursor: not-allowed; }
.slot.is-lunch { background: linear-gradient(90deg, #f7fbf7, #edf7ef); border-bottom-color: #dceee0; cursor: not-allowed; }
.slot__pause-icon { display: grid; place-items: center; width: 100%; height: 100%; pointer-events: none; }
.slot__pause-icon svg { width: 23px; height: 23px; stroke-width: 1.7; }
.slot__pause-icon--recess { color: #7447bf; }
.slot__pause-icon--lunch { color: #2e9348; }
.event {
	position: relative;
	z-index: 4;
	min-width: 0;
	min-height: 0;
	margin: 1px 2px;
	padding: 3px 5px;
	border: 1px solid color-mix(in srgb, var(--event-color) 70%, #fff);
	border-radius: 7px;
	color: #162033;
	background: color-mix(in srgb, var(--event-color) 16%, white);
	box-shadow: 0 2px 7px rgba(15, 23, 42, .09);
	overflow: hidden;
	cursor: grab;
	touch-action: none;
	user-select: none;
}
.event:active { cursor: grabbing; }
.event.is-split { width: calc(50% - 3px); }
.event.is-split-left { justify-self: start; margin-right: 0; }
.event.is-split-right { justify-self: end; margin-left: 0; }
.event.is-dragging { opacity: .78; transform: none; box-shadow: 0 12px 28px rgba(15, 23, 42, .28); }
.event.is-resizing { opacity: .76; box-shadow: 0 8px 20px rgba(15, 23, 42, .2); }
.event.is-invalid-target { overflow: visible; cursor: not-allowed; }
.event.is-invalid-target::before { content: "⛔"; position: absolute; inset: 50% auto auto 50%; z-index: 10; transform: translate(-50%, -50%); font-size: 24px; line-height: 1; filter: drop-shadow(0 1px 2px rgba(255, 255, 255, .9)); pointer-events: none; }
.is-palette-dragging .event { pointer-events: none; }
.drag-preview { z-index: 8; display: grid; place-items: center; min-width: 0; margin: 1px 2px; border: 2px solid var(--brand); border-radius: 7px; background: rgba(18, 149, 173, .2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7); pointer-events: none; }
.drag-preview.is-invalid { border-color: #dc3545; background: rgba(220, 53, 69, .18); color: #b4233a; font-size: 22px; }
.event__resize { position: absolute; left: 50%; z-index: 6; width: 48px; height: 14px; transform: translateX(-50%); cursor: ns-resize; touch-action: none; }
.event__resize::after { content: ""; position: absolute; left: 50%; top: 50%; width: 28px; height: 4px; transform: translate(-50%, -50%); border-radius: 99px; background: #fff; box-shadow: 0 0 0 1px rgba(15, 23, 42, .2), 0 1px 2px rgba(15, 23, 42, .18); }
.event__resize--top { top: -6px; }
.event__resize--bottom { bottom: -6px; }
.event strong, .event small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.event strong { font-size: 9px; line-height: 1.15; }
.event small { margin-top: 2px; color: #475569; font-size: 7.5px; }
.event.is-single-slot { display: flex; align-items: center; justify-content: center; gap: 3px; }
.event.is-single-slot strong { min-width: 0; }
.event.is-single-slot small { flex: 0 0 auto; margin-top: 0; }
.event.is-minute-compact { padding-block: 0; }
.event.is-minute-compact small, .event.is-minute-compact .event__resize { display: none; }
.event.is-minute-compact strong { font-size: 8px; line-height: 1; }
.event.is-minute-tiny { padding: 0 3px; border-top-width: 0; border-bottom-width: 0; border-radius: 3px; }
.event.is-minute-tiny strong, .event.is-minute-tiny small, .event.is-minute-tiny .event__resize { display: none; }
.subject-chip.is-dragging { opacity: .65; transform: scale(.98); cursor: grabbing; }
.palette-drag-preview { position: fixed; z-index: 200; max-width: min(280px, calc(100vw - 16px)); margin: 0; opacity: .94; transform: scale(1.03); box-shadow: 0 14px 32px rgba(15, 23, 42, .28); pointer-events: none; }
.grid-help { padding: 6px 10px 7px; border-top: 1px solid var(--line); text-align: center; }

.total-ring { --progress: 0%; position: relative; display: grid; place-items: center; width: 94px; height: 94px; margin: 8px auto 10px; border-radius: 50%; background: conic-gradient(var(--brand) var(--progress), #e9f6f8 0); text-align: center; }
.total-ring::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; background: #fff; }
.total-ring__content { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: calc(100% - 18px); min-width: 0; max-width: 70px; text-align: center; }
.total-ring__content strong { display: block; color: var(--ink); font-size: 17px; line-height: 1; white-space: nowrap; }
.total-ring__content small { display: block; color: var(--muted); font-size: 8px; line-height: 1; white-space: nowrap; }
.totals-summary { display: grid; grid-template-columns: 1fr; gap: 6px; margin: 0; }
.totals-summary > div { padding: 8px; border-radius: 10px; background: var(--soft); text-align: center; }
.totals-summary strong { display: block; font-size: 12px; }
.totals-summary span { color: var(--muted); font-size: 9px; }
.subject-totals { display: grid; align-content: start; gap: 0; }
.subject-totals > .compact-hint { padding-top: 4px; }
.volume-row { --subject-color: #64748b; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 3px 8px; padding: 8px 2px; border-top: 1px solid var(--line); }
.volume-row__icon { display: grid; grid-row: 1 / span 2; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: var(--subject-color); background: color-mix(in srgb, var(--subject-color) 10%, white); }
.volume-row__icon svg { width: 15px; height: 15px; stroke-width: 1.9; }
.volume-row__top { display: flex; justify-content: space-between; gap: 6px; margin: 0 0 3px; font-size: 9px; line-height: 1.2; }
.volume-row__top span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.volume-row__top strong { flex: none; }
.volume-row__bar { height: 4px; overflow: hidden; border-radius: 99px; background: #edf1f5; }
.volume-row__bar i { display: block; width: var(--volume); height: 100%; border-radius: inherit; background: var(--subject-color); }

label { display: grid; gap: 4px; color: #334155; font-size: 10px; font-weight: 700; }
input, select { width: 100%; min-height: 34px; padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 9px; color: var(--ink); background: #fff; }
input:focus, select:focus { outline: 3px solid rgba(18, 149, 173, .14); border-color: var(--brand); }
input[type="color"] { padding: 3px; }
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 12px; }
.modal__backdrop { position: fixed; inset: 0; background: rgba(15, 23, 42, .5); backdrop-filter: blur(3px); }
.modal__panel { position: relative; width: min(540px, 100%); max-height: calc(100vh - 24px); overflow: auto; border: 1px solid rgba(255,255,255,.75); border-radius: 18px; background: #fff; box-shadow: 0 24px 70px rgba(15,23,42,.28); }
.modal__panel--wide { width: min(1040px, 100%); }
.modal__head { position: sticky; top: 0; z-index: 2; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.96); }
.modal__head h2 { margin: 2px 0 0; font-size: 17px; }
.modal form { display: grid; gap: 12px; padding: 14px; }
.meta-fields { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.shared-schedule { display: grid; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: #f8fafc; }
.shared-schedule__intro { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.shared-schedule__intro > div { display: grid; gap: 2px; }
.shared-schedule__intro > div strong { font-size: 12px; }
.shared-schedule__intro > div span { color: var(--muted); font-size: 9px; }
.working-days { display: grid; grid-template-columns: repeat(auto-fit, minmax(74px, 1fr)); gap: 5px; flex: 1; }
.schedule-toggle { display: flex; align-items: center; justify-content: center; gap: 5px; min-width: 0; padding: 5px 6px; border: 1px solid #bde3e9; border-radius: 9px; background: #eefbfc; cursor: pointer; }
.schedule-toggle input { flex: 0 0 15px; width: 15px; min-height: 15px; accent-color: var(--brand); }
.schedule-toggle strong { color: var(--ink); font-size: 9px; white-space: nowrap; }
.schedule-groups { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.schedule-group { padding: 8px; border: 1px solid var(--line); border-left: 3px solid var(--brand); border-radius: 10px; background: #fff; }
.schedule-group:nth-child(2), .schedule-group:nth-child(4) { border-left-color: #7a4fd0; }
.schedule-group h3 { margin: 0 0 6px; font-size: 9px; }
.schedule-group > div { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.schedule-group label { font-size: 8px; }
.schedule-group input { min-height: 31px; padding: 4px; font-size: 10px; }
.schedule-step-note { margin: 0; color: var(--muted); font-size: 8px; text-align: right; }
.day-config { padding: 8px; border: 1px solid var(--line); border-radius: 12px; background: #f8fafc; }
.day-config:not(.is-enabled) .day-config__times { opacity: .45; pointer-events: none; }
.day-config__toggle { display: flex; grid-column: 1 / -1; align-items: center; gap: 6px; margin-bottom: 8px; font-size: 11px; }
.day-config__toggle input { width: 16px; min-height: 16px; }
.day-config__times { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.day-config__times h3 { grid-column: 1 / -1; margin: 5px 0 0; color: var(--muted); font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }
.day-config__morning-only { grid-column: 1 / -1; margin: 8px 0 0; padding: 7px; border-radius: 8px; color: #64748b; background: #edf2f7; font-size: 8px; font-weight: 700; text-align: center; }
.day-config__times label { font-size: 8px; }
.day-config__times input { min-height: 29px; padding: 4px; font-size: 10px; }
.form-row { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 7px; }
.form-help { margin: -5px 0 0; color: var(--muted); font-size: 9px; }
.modal__actions { justify-content: flex-end; gap: 7px; padding-top: 3px; }
.modal__actions--split { display: grid; grid-template-columns: auto 1fr auto auto; }
.event-modal { width: min(680px, 100%); border-radius: 18px; }
.event-modal__head { display: grid; grid-template-columns: 38px 1fr 32px; gap: 10px; padding: 12px 16px; }
.event-modal__head > div { align-self: center; }
.event-modal__head h2 { margin: 2px 0 0; font-size: 18px; line-height: 1.05; }
.event-modal__head .eyebrow { color: #078da4; font-size: 11px; }
.event-modal__title-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; color: #078da4; background: #eaf9fc; }
.event-modal__title-icon svg { width: 22px; height: 22px; stroke-width: 1.9; }
.event-modal__close { width: 32px; min-height: 32px; border-radius: 9px; font-size: 20px; }
.event-modal__close svg { width: 18px; height: 18px; stroke-width: 2.2; }
.modal .event-modal__form { gap: 0; padding: 0; }
.event-modal__primary { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1.05fr); gap: 10px; padding: 14px 16px 8px; }
.event-modal__primary .event-field:first-child { padding-right: 10px; border-right: 1px solid #e2e8f0; }
.event-color-picker { position: relative; min-width: 0; }
.event-color-trigger { display: grid; place-items: center; width: 100%; min-height: 44px; padding: 5px; border: 1px solid #d7dee7; border-radius: 14px; background: #fff; cursor: pointer; }
.event-color-trigger > span { width: 28px; height: 28px; border: 3px solid #fff; border-radius: 50%; background: var(--selected-color, #64748b); box-shadow: 0 0 0 1px #cbd5e1, 0 3px 9px rgba(15,23,42,.16); }
.event-color-palette { position: absolute; z-index: 8; top: calc(100% + 7px); left: 50%; display: grid; grid-template-columns: repeat(8, 27px); gap: 7px; width: max-content; max-height: 310px; overflow-y: auto; padding: 10px; border: 1px solid #dbe3ec; border-radius: 14px; background: #fff; box-shadow: 0 16px 38px rgba(15,23,42,.2); transform: translateX(-50%); }
.event-color-palette > button { width: 27px; height: 27px; padding: 0; border: 3px solid #fff; border-radius: 50%; background: var(--swatch); box-shadow: 0 0 0 1px #cbd5e1; cursor: pointer; }
.event-color-palette > button.is-selected { box-shadow: 0 0 0 2px #162033; }
.event-modal__schedule { display: grid; grid-template-columns: 1.05fr .82fr 20px .82fr; align-items: end; gap: 10px; padding: 8px 16px 14px; }
.event-field { display: grid; min-width: 0; gap: 5px; color: #334155; font-size: 12px; font-weight: 500; }
.event-field__label { display: flex; align-items: center; gap: 7px; min-width: 0; padding-left: 1px; }
.event-field__control { position: relative; display: block; min-width: 0; }
.event-field__control input, .event-field__control select { min-height: 44px; padding: 8px 28px 8px 10px; border: 1px solid #d7dee7; border-radius: 10px; color: #162033; background-color: #fff; font-size: 13px; font-weight: 700; }
.event-field__control input::placeholder { color: #929aaa; font-weight: 400; opacity: 1; }
.event-field__icon { --field-color: #1295ad; display: grid; flex: 0 0 20px; place-items: center; width: 20px; height: 20px; border-radius: 6px; color: var(--field-color); background: color-mix(in srgb, var(--field-color) 9%, white); pointer-events: none; }
.event-field__icon svg { width: 14px; height: 14px; stroke-width: 1.9; }
.event-field__icon--tag { --field-color: #914bea; }
.event-field__icon--calendar { --field-color: #078da4; }
.event-field__icon--start { --field-color: #2da33b; }
.event-field__icon--end { --field-color: #d20b39; }
.event-modal__arrow { display: grid; place-items: center; height: 44px; color: #8a94a6; }
.event-modal__arrow svg { width: 18px; height: 18px; stroke-width: 1.8; }
.event-modal__actions { justify-content: space-between; min-height: 68px; padding: 12px 16px; border-top: 1px solid #e2e8f0; }
.event-modal__actions .button { min-height: 40px; font-size: 13px; }
.event-modal__delete { padding: 5px 8px; color: #cf123f; background: transparent; }
.event-modal__delete-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: #fff0f4; }
.event-modal__delete-icon svg { width: 18px; height: 18px; stroke-width: 2; }
.event-modal__save { min-width: 180px; border-radius: 10px; background: linear-gradient(135deg, #0797ac, #008aa1); box-shadow: 0 7px 18px rgba(0, 143, 164, .2); }
.event-modal__save svg { width: 24px; height: 24px; }
body.has-modal { overflow: hidden; }
.toast { position: absolute; right: 14px; bottom: 14px; z-index: 150; max-width: min(390px, calc(100% - 28px)); padding: 10px 13px; border-radius: 11px; color: #fff; background: #162033; box-shadow: 0 12px 30px rgba(15,23,42,.24); font-size: 11px; font-weight: 700; }
.toast.is-error { background: #b4233a; }

.auth-shell { min-height: min(720px, 100vh); display: grid; place-items: center; padding: 20px; }
.auth-card { width: min(560px, 100%); padding: clamp(24px, 5vw, 48px); border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: 22px; background: #fff; box-shadow: var(--shadow); text-align: center; }
.auth-card__icon { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 13px; border-radius: 50%; background: #eaf9fc; font-size: 34px; }
.auth-card h1 { margin: 6px 0 9px; font-size: clamp(22px, 4vw, 34px); }
.auth-card p:not(.eyebrow) { margin: 0 auto 20px; color: var(--muted); line-height: 1.65; }

@media (max-width: 1150px) {
	.schedule-workspace { grid-template-columns: minmax(0, 1fr) 245px; }
	.total-ring { width: 76px; height: 76px; margin: 0; border-width: 6px; }
}

@media (max-width: 760px) {
	.app { padding: 6px 6px 12px; }
	.app-header { position: static; flex-wrap: wrap; padding: 9px 10px; border-radius: 12px; }
	.app-header__identity { flex: 1 1 auto; }
	.app-header__mark { flex-basis: 32px; height: 32px; }
	.schedule-selector select { max-width: 154px; min-height: 32px; padding-block: 5px; font-size: 11px; }
	.app-header__actions { gap: 3px; }
	.app-header__actions .button { min-width: 34px; padding: 7px; }
	.app-header__actions .button span { display: none; }
	.save-status { flex: 0 0 34px; }
	.workspace { display: flex; flex-direction: column; gap: var(--block-gap); }
	.subject-card, .totals-card { width: 100%; padding: 9px; }
	.subject-card { grid-template-columns: minmax(0, 1fr); padding: 6px; }
	.subjects { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.subject-chip { width: 100%; }
	.schedule-workspace { display: flex; flex-direction: column; gap: var(--block-gap); }
	.timetable-card { width: 100%; }
	.schedule-grid { min-width: 556px; }
	.totals-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.totals-card__overview { grid-template-columns: minmax(0, 1fr) auto; }
	.totals-card__heading { grid-column: 1 / -1; }
	.total-ring { width: 68px; height: 68px; grid-column: 2; grid-row: 1 / span 2; }
	.total-ring__content { gap: 3px; }
	.total-ring__content strong { max-width: 100%; font-size: 13px; letter-spacing: -.03em; }
	.total-ring__content small { font-size: 7px; }
	.totals-summary { grid-column: 1; margin: 0; }
	.subject-totals { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 12px; }
	.meta-fields { grid-template-columns: 1fr 1fr; }
	.shared-schedule__intro { align-items: stretch; flex-direction: column; }
	.schedule-groups { grid-template-columns: 1fr 1fr; }
	.modal { align-items: start; padding: 8px 0 0; }
	.modal__panel, .modal__panel--wide { box-sizing: border-box; width: calc(100% - 12px); max-width: calc(100% - 12px); max-height: calc(100dvh - 16px); overflow-x: hidden; border-radius: 18px; }
	.modal form, .shared-schedule, .working-days, .schedule-groups, .schedule-group, .modal__actions { min-width: 0; box-sizing: border-box; }
	.working-days { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
	.schedule-toggle { width: 100%; min-width: 0; overflow: hidden; }
	.schedule-toggle strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
	.schedule-group > div { min-width: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.schedule-group input, .schedule-group select { box-sizing: border-box; min-width: 0; width: 100%; padding: 4px 0; font-size: 9px; letter-spacing: -.03em; text-align: center; font-variant-numeric: tabular-nums; }
	.modal__actions .button { min-width: 0; max-width: 100%; }
	.event-modal { width: 95%; }
	.event-modal__head { grid-template-columns: 32px 1fr 32px; gap: 8px; padding: 10px 12px; }
	.event-modal__title-icon { width: 32px; height: 32px; border-radius: 9px; }
	.event-modal__title-icon svg { width: 20px; height: 20px; }
	.event-modal__head .eyebrow { font-size: 10px; }
	.event-modal__close { width: 32px; min-height: 32px; border-radius: 9px; }
	.event-modal__primary { grid-template-columns: minmax(0, 1fr) 50px minmax(0, 1fr); gap: 6px; padding: 10px 10px 6px; }
	.event-modal__primary .event-field:first-child { padding-right: 6px; }
	.event-color-trigger { min-height: 44px; padding: 5px; }
	.event-color-trigger > span { width: 26px; height: 26px; }
	.event-color-palette { left: 50%; grid-template-columns: repeat(8, 25px); gap: 6px; max-height: 285px; transform: translateX(-50%); }
	.event-color-palette > button { width: 25px; height: 25px; }
	.event-modal__schedule { grid-template-columns: 1.1fr .84fr 12px .84fr; gap: 3px; padding: 6px 8px 10px; }
	.event-field { gap: 5px; font-size: 10px; }
	.event-field__control input, .event-field__control select { max-width: 100%; min-width: 0; min-height: 44px; padding: 7px 20px 7px 8px; border-radius: 11px; font-size: 12px; }
	.event-modal__schedule input[type="time"] { padding-inline: 6px 2px; font-size: 10px; }
	.event-field__label { gap: 4px; }
	.event-field__icon { flex-basis: 20px; width: 20px; height: 20px; border-radius: 6px; }
	.event-field__icon svg { width: 13px; height: 13px; }
	.event-modal__arrow { height: 44px; }
	.event-modal__arrow svg { width: 15px; height: 15px; }
	.event-modal__actions { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 6px; min-height: 64px; padding: 10px; }
	.event-modal__actions .button { width: 100%; min-width: 0; min-height: 40px; padding-inline: 6px; font-size: 12px; }
	.event-modal__delete { gap: 5px; }
	.event-modal__delete-icon { width: 28px; height: 28px; flex: 0 0 28px; }
	.event-modal__save { min-width: 0; }
}

@media (max-width: 460px) {
	.app-header__identity .eyebrow { display: none; }
	.app-header h1 { max-width: 125px; font-size: 14px; }
	.save-status { width: 34px; height: 34px; padding: 7px; }
	.meta-fields, .schedule-groups { grid-template-columns: 1fr 1fr; }
	.form-row { grid-template-columns: 1fr 1fr; }
	.form-row label:first-child { grid-column: 1 / -1; }
	.modal__actions--split { grid-template-columns: auto 1fr auto; }
	.modal__actions--split .button--soft { display: none; }
}

@media print {
	.app-header__actions, .subject-card, .totals-card, .grid-help { display: none !important; }
	.workspace { display: block; }
	.card { box-shadow: none; }
}