/* Sri Lorven School: admin panel styles */
:root {
  --navy: #1b2559;
  --navy-deep: #131a42;
  --indigo: #33409c;
  --gold: #f4b400;
  --ink: #1b1e2f;
  --body: #474b63;
  --muted: #666b85;
  --line: #e1e4ee;
  --bg: #f4f5fa;
  --red: #b3192a;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font: 400 0.95rem/1.55 'Plus Jakarta Sans', system-ui, sans-serif; color: var(--body); background: var(--bg); }
h1, h2 { color: var(--ink); margin: 0 0 0.4rem; line-height: 1.2; }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.1rem; }
p { margin: 0 0 0.8rem; }
a { color: var(--indigo); }
img { max-width: 100%; display: block; }
code { background: #eceef6; padding: 0.1rem 0.35rem; border-radius: 4px; }
.muted { color: var(--muted); font-weight: 400; }
.small { font-size: 0.86rem; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

.shell { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; }
.side { background: var(--navy-deep); color: #c5cbee; padding: 1.1rem 1rem; display: flex; flex-direction: column; gap: 1rem; }
.side__brand { color: #fff; font-weight: 700; font-size: 1.1rem; text-decoration: none; display: grid; }
.side__brand span { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.side { min-width: 0; }
.side nav { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.side nav a { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.55rem 0.8rem; border-radius: 8px; color: inherit; text-decoration: none; font-weight: 600; white-space: nowrap; }
.side nav a:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.side nav a[aria-current='page'] { background: var(--gold); color: var(--navy-deep); }
.count { background: #e23d4f; color: #fff; border-radius: 999px; font-size: 0.72rem; padding: 0 0.45rem; }
.side__foot { display: flex; gap: 1rem; align-items: center; font-size: 0.88rem; }
.side__foot a { color: #c5cbee; }
.linkbtn { background: none; border: 0; padding: 0; color: #c5cbee; font: inherit; text-decoration: underline; cursor: pointer; }
.main { padding: 1.25rem 1rem 3rem; min-width: 0; }
.main input, .main select, .main textarea { max-width: 100%; }

.pagetitle { margin-bottom: 1.25rem; }
.pagetitle--row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem; }
.card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.25rem; margin-bottom: 1.25rem; }
.card__head { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; justify-content: space-between; align-items: baseline; margin-bottom: 0.6rem; }
.card h2 { margin-bottom: 0.9rem; }
.stack h2 { margin: 0.75rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); }
.stack h2:first-of-type { border: 0; padding: 0; margin: 0; }

.flash { padding: 0.75rem 1rem; border-radius: 10px; font-weight: 600; margin-bottom: 1rem; }
.flash--ok { background: #e4f5ea; color: #14532d; }
.flash--error { background: #fde8ea; color: #8f1220; }

.btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.65rem 1.15rem; border-radius: 10px; border: 0; background: var(--navy); color: #fff; font: inherit; font-size: 0.93rem; font-weight: 700; line-height: 1.2; text-decoration: none; cursor: pointer; }
.btn:hover { background: var(--navy-deep); }
.btn--small { padding: 0.42rem 0.8rem; font-size: 0.84rem; border-radius: 8px; }
.btn--light { background: #fff; color: var(--navy); border: 1px solid var(--line); }
.btn--light:hover { background: #f1f3fa; }
.btn--danger { background: var(--red); }
.btn--danger:hover { background: #8f1220; }

label { display: block; font-weight: 600; color: var(--ink); font-size: 0.9rem; }
label > input, label > select, label > textarea { display: block; margin-top: 0.35rem; }
form fieldset { min-width: 0; margin: 0; padding: 0.9rem 1rem 1rem; border: 1px solid var(--line); border-radius: 10px; }
form fieldset > legend { padding: 0 0.35rem; color: var(--ink); font-size: 0.9rem; font-weight: 700; }
input[type='text'], input[type='email'], input[type='url'], input[type='password'], input[type='date'], input[type='time'], input[type='number'], input[type='tel'], input[type='search'], select, textarea {
  width: 100%; padding: 0.6rem 0.75rem; border: 1.5px solid #cdd2e2; border-radius: 9px; font: inherit; color: var(--ink); background: #fff;
}
/* Give dropdowns the same touch target in Safari; keep listboxes and multiple selects native. */
select:not([multiple]):not([size]), select:not([multiple])[size='1'], select:not([multiple])[size='0'] {
  -webkit-appearance: none; appearance: none; min-height: 44px; line-height: 1.4; padding-right: 2.25rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23666b85' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 0.7rem center; background-size: 1rem;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(51, 64, 156, 0.15); }
input[type='file'] { font: inherit; font-size: 0.86rem; }
.check { display: inline-flex; align-items: center; gap: 0.45rem; font-weight: 600; }
.check input { width: 1.05rem; height: 1.05rem; margin: 0; accent-color: var(--navy); }
.checks { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; }
.stack { display: grid; gap: 1rem; max-width: 460px; }
.stack--wide { max-width: 900px; }
.grid { display: grid; gap: 1rem; }
.grid > * { min-width: 0; }
.row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.current { display: flex; align-items: center; gap: 0.8rem; }
.current img { width: 84px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }

.drop { display: grid; gap: 0.35rem; border: 2px dashed #b9c0dc; border-radius: 12px; padding: 1.5rem 1rem; text-align: center; background: #f8f9fd; cursor: pointer; align-content: center; justify-items: center; min-height: 170px; position: relative; }
.drop.is-over { border-color: var(--indigo); background: #eef0fb; }
.drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.drop strong { color: var(--navy); font-size: 1.05rem; }
.drop span { color: var(--muted); font-weight: 500; font-size: 0.85rem; }

.upload-status { margin: 0; font-weight: 600; color: var(--ink); font-size: 0.9rem; }
.upload-status.is-error { color: var(--red); }

.tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.9rem; margin-bottom: 1.25rem; }
.tile { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.1rem; text-decoration: none; display: grid; gap: 0.15rem; color: var(--body); }
.tile:hover { border-color: var(--indigo); }
.tile strong { font-size: 1.9rem; color: var(--ink); line-height: 1.1; }
.tile em { font-style: normal; font-weight: 700; color: var(--indigo); font-size: 0.86rem; margin-top: 0.5rem; }
.tile b { color: #b3192a; }

.tablewrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
th { text-align: left; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 0.7rem 0.75rem; border-bottom: 1px solid #eef0f6; vertical-align: top; }
tr:last-child td { border-bottom: 0; }
.actions { white-space: nowrap; text-align: right; }
.actions > * { display: inline-block; vertical-align: top; margin-left: 0.6rem; }
.pill { display: inline-block; padding: 0.12rem 0.6rem; border-radius: 999px; font-size: 0.74rem; font-weight: 700; text-transform: capitalize; background: #eceef6; color: var(--body); }
.pill--new { background: #fff1c9; color: #7a5600; }
.pill--contacted { background: #e4f5ea; color: #14532d; }
.pill--closed { background: #eceef6; color: var(--muted); }

.danger summary { cursor: pointer; color: var(--red); font-weight: 600; font-size: 0.88rem; list-style: none; }
.danger summary::-webkit-details-marker { display: none; }
.danger[open] summary { color: var(--muted); }
.danger form { margin-top: 0.4rem; }

.tabs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.tabs a { padding: 0.4rem 0.85rem; border-radius: 999px; background: #fff; border: 1px solid var(--line); text-decoration: none; font-weight: 600; color: var(--ink); font-size: 0.88rem; }
.tabs a[aria-current='true'], .tabs a[aria-current='page'] { background: var(--navy); border-color: var(--navy); color: #fff; }

.photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0.9rem; }
.photo { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 0.6rem; display: grid; gap: 0.55rem; align-content: start; }
.photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.photo__form { display: grid; gap: 0.4rem; }
.photo__form input[type='text'] { padding: 0.42rem 0.6rem; font-size: 0.86rem; }
.photo__row { display: flex; justify-content: space-between; align-items: center; }

.facts { display: grid; grid-template-columns: 9rem 1fr; gap: 0.45rem 1rem; margin: 0; }
.facts dt { color: var(--muted); font-weight: 600; font-size: 0.86rem; }
.facts dd { margin: 0; color: var(--ink); }
.filelist { margin: 0 0 0.75rem; padding-left: 1.1rem; display: grid; gap: 0.4rem; }

.enquiry h2 { margin: 0; }
.enquiry__head { display: flex; justify-content: space-between; gap: 1rem; align-items: start; }
.enquiry__contact { font-weight: 700; margin: 0.5rem 0; }
.enquiry__msg { background: #f6f7fb; border-radius: 8px; padding: 0.7rem 0.85rem; white-space: pre-wrap; }
.enquiry select { width: auto; padding: 0.4rem 0.6rem; }

.loginpage { display: grid; place-items: center; min-height: 100vh; padding: 1rem; background: var(--navy-deep); }
.login { width: min(100%, 380px); background: #fff; border-radius: 16px; padding: 2rem 1.75rem; }
.login h1 { font-size: 1.25rem; }
.login__logo { width: 200px; height: auto; margin: 0 auto 1.25rem; }
.login form { display: grid; gap: 1rem; margin: 1.25rem 0 1rem; }

@media (min-width: 640px) {
  .grid--2 { grid-template-columns: 1fr 1fr; }
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--upload { grid-template-columns: 1.1fr 1fr; align-items: stretch; }
  .upload-status { margin: 0; font-weight: 600; color: var(--ink); font-size: 0.9rem; }
.upload-status.is-error { color: var(--red); }

.tiles { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 900px) {
  .shell { grid-template-columns: 232px 1fr; }
  .side { position: sticky; top: 0; height: 100vh; padding: 1.5rem 1rem; }
  .side nav { flex-direction: column; flex-wrap: nowrap; }
  .side__foot { margin-top: auto; flex-direction: column; align-items: flex-start; gap: 0.5rem; }
  .main { padding: 2rem 2.25rem 4rem; max-width: 1180px; }
}

/* ---------- school office ---------- */
.side__group { margin: 0.9rem 0 0.2rem; padding: 0 0.8rem; font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: #8089bd; font-weight: 700; flex-basis: 100%; }
.side__group:first-child { margin-top: 0; }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
th.num { text-align: right; }
.linkbtn--dark { color: var(--red); font-size: 0.86rem; }
.btn--wa { background: #128c4b; }
.btn--wa:hover { background: #0c6d39; }
.flash--demo { background: #fff4d1; color: #6b4a00; display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; justify-content: space-between; font-weight: 500; }
.filterbar { margin-bottom: 1rem; }
.filterbar select { width: auto; }
.row > select, .row > input[type='date'], .row > input[type='number'] { width: auto; }
.admit { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; border-color: var(--gold); background: #fffbee; }
.admit h2, .admit p { margin: 0; }

.kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem; margin-bottom: 1.25rem; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1rem 1.1rem; display: grid; gap: 0.1rem; text-decoration: none; color: var(--body); min-width: 0; }
a.kpi:hover { border-color: var(--indigo); }
.kpi span { font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.kpi strong { font-size: 1.65rem; line-height: 1.2; color: var(--ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi strong.kpi__small { font-size: 1.1rem; padding: 0.3rem 0; }
.kpi em { font-style: normal; font-size: 0.84rem; color: var(--muted); }
.kpi--warn { border-left: 4px solid var(--red); }
.kpi--warn strong { color: var(--red); }

.bars { display: grid; gap: 0.45rem; }
.bar { display: grid; grid-template-columns: 5.5rem 1fr 2rem; gap: 0.6rem; align-items: center; text-decoration: none; color: var(--ink); font-size: 0.88rem; font-weight: 600; }
.bar__track { height: 0.7rem; background: #eef0f6; border-radius: 999px; overflow: hidden; }
.bar__fill { display: block; height: 100%; background: var(--indigo); border-radius: 999px; min-width: 2px; }
.bar__n { text-align: right; font-variant-numeric: tabular-nums; }

.tabs__n { margin-left: 0.35rem; font-size: 0.74rem; font-weight: 700; color: #14532d; background: #e4f5ea; padding: 0.05rem 0.4rem; border-radius: 999px; }
.tabs__n--warn { background: #fde8ea; color: #8f1220; }
.tabs__n--todo { background: #eceef6; color: var(--muted); }

.attgrid { display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.att { border: 1px solid var(--line); border-radius: 12px; padding: 0.6rem 0.75rem 0.7rem; margin: 0; min-width: 0; }
.att legend { font-weight: 700; color: var(--ink); padding: 0 0.3rem; font-size: 0.92rem; }
.att__roll { color: var(--muted); font-weight: 600; }
.seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.3rem; }
.seg label { position: relative; font-size: 0.82rem; }
.seg input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.seg span { display: block; text-align: center; padding: 0.4rem 0.2rem; border-radius: 8px; border: 1px solid var(--line); background: #f6f7fb; color: var(--muted); font-weight: 700; }
.seg input:focus-visible + span { outline: 3px solid var(--gold); outline-offset: 1px; }
.seg input:checked + .seg--P { background: #1f8a4c; border-color: #1f8a4c; color: #fff; }
.seg input:checked + .seg--L { background: #d98a00; border-color: #d98a00; color: #fff; }
.seg input:checked + .seg--A { background: var(--red); border-color: var(--red); color: #fff; }

.walist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.walist li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.6rem; padding: 0.55rem 0.75rem; background: #f6f7fb; border-radius: 10px; }

.dots { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.5rem; }
.dot { width: 2rem; height: 2rem; border-radius: 8px; display: grid; place-items: center; font-size: 0.8rem; font-weight: 700; color: #fff; }
.dot--P { background: #1f8a4c; }
.dot--L { background: #d98a00; }
.dot--A { background: var(--red); }

.scan__view { position: relative; background: #0d1230; border-radius: 12px; overflow: hidden; aspect-ratio: 4 / 3; display: grid; place-items: center; }
.scan__view video { width: 100%; height: 100%; object-fit: cover; }
.scan__hint { position: absolute; inset: auto 0 0 0; margin: 0; padding: 0.6rem; text-align: center; color: #fff; background: rgba(13, 18, 48, 0.65); font-weight: 600; font-size: 0.9rem; }
.scan__view.is-ok { box-shadow: inset 0 0 0 6px #1f8a4c; }
.scan__view.is-bad { box-shadow: inset 0 0 0 6px var(--red); }
.scan__last { border-radius: 12px; padding: 1rem; margin-bottom: 0.9rem; background: #e4f5ea; color: #14532d; }
.scan__last.is-bad { background: #fde8ea; color: #8f1220; }
.scan__last strong { display: block; font-size: 1.35rem; color: inherit; }

.marks input { width: 4.6rem; padding: 0.4rem 0.45rem; text-align: center; }
.marks td, .marks th { padding: 0.4rem 0.45rem; vertical-align: middle; }
.marks td:first-child { white-space: nowrap; font-weight: 600; color: var(--ink); }
.chiprow { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.chip { display: inline-flex; align-items: center; gap: 0.3rem; background: #eef0fb; border-radius: 999px; padding: 0.25rem 0.35rem 0.25rem 0.8rem; font-weight: 600; color: var(--ink); font-size: 0.88rem; }
.chip button { border: 0; background: #fff; width: 1.4rem; height: 1.4rem; border-radius: 50%; cursor: pointer; color: var(--red); font-weight: 700; line-height: 1; }
.diarylist { list-style: none; margin: 0 0 0.9rem; padding: 0; display: grid; gap: 0.6rem; }
.diarylist li { display: flex; justify-content: space-between; gap: 1rem; align-items: start; background: #f6f7fb; border-radius: 10px; padding: 0.7rem 0.85rem; }
.diarylist p { margin: 0.15rem 0; white-space: pre-wrap; color: var(--ink); }

.map { height: 320px; border-radius: 12px; overflow: hidden; background: #e9ecf5; z-index: 0; }
.map--admin { height: 380px; }
.busmark { background: var(--navy); color: #fff; border-radius: 999px; border: 3px solid #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); font-weight: 700; font-size: 0.8rem; display: grid; place-items: center; }
.busmark--live { background: #1f8a4c; }
.busmark--school { background: var(--gold); color: var(--navy-deep); }

.idcards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.idcard { width: 100%; max-width: 340px; border: 1px solid #c9cee0; border-radius: 14px; overflow: hidden; background: #fff; break-inside: avoid; }
.idcard header { background: var(--navy-deep); padding: 0.6rem 0.9rem; display: flex; justify-content: space-between; align-items: center; color: var(--gold); font-weight: 700; font-size: 0.8rem; }
.idcard header img { height: 44px; width: auto; }
.idcard__body { display: grid; grid-template-columns: 1fr auto; gap: 0.75rem; padding: 0.85rem 0.9rem; align-items: center; }
.idcard h2 { margin: 0; font-size: 1.1rem; }
.idcard__class { margin: 0.1rem 0 0.5rem; font-weight: 700; color: var(--indigo); font-size: 0.88rem; }
.idcard dl { display: grid; grid-template-columns: auto 1fr; gap: 0.1rem 0.6rem; margin: 0; font-size: 0.78rem; }
.idcard dt { color: var(--muted); font-weight: 600; }
.idcard dd { margin: 0; color: var(--ink); font-weight: 600; overflow-wrap: anywhere; }
.idcard__qr svg { width: 112px; height: 112px; display: block; }
.idcard footer { background: #f1f3fa; padding: 0.4rem 0.9rem; font-size: 0.68rem; color: var(--body); text-align: center; }

.receipt, .reportcard { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.75rem; max-width: 720px; margin-bottom: 1.25rem; }
.receipt > header, .reportcard > header { display: flex; gap: 1rem; align-items: center; border-bottom: 2px solid var(--navy); padding-bottom: 0.9rem; margin-bottom: 1rem; }
.receipt > header img, .reportcard > header img { width: 130px; height: auto; }
.receipt > header div, .reportcard > header div { display: grid; font-size: 0.86rem; }
.receipt > header strong, .reportcard > header strong { font-size: 1.15rem; color: var(--ink); }
.receipt h2, .reportcard h2 { text-align: center; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.95rem; margin-bottom: 1rem; }
.receipt__void { color: var(--red); }
.receipt__amount { display: flex; justify-content: space-between; align-items: baseline; background: #f1f3fa; border-radius: 10px; padding: 0.8rem 1rem; margin: 1.1rem 0 0.6rem; }
.receipt__amount strong { font-size: 1.5rem; color: var(--ink); }
.receipt > footer, .reportcard > footer { display: flex; justify-content: space-between; gap: 0.75rem; margin-top: 2.75rem; font-size: 0.84rem; color: var(--muted); }
.reportcard > footer span { border-top: 1px solid #b9bfd6; padding-top: 0.3rem; flex: 1 1 0; min-width: 0; text-align: center; }
.reportcard__who { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem 1rem; margin: 0 0 1rem; }
.reportcard__who dt { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); font-weight: 700; }
.reportcard__who dd { margin: 0; color: var(--ink); font-weight: 600; }
.reportcard table th:not(:first-child), .reportcard table td:not(:first-child) { text-align: center; }
.reportcard tfoot th { font-size: 0.92rem; text-transform: none; letter-spacing: 0; color: var(--ink); border-top: 2px solid var(--navy); border-bottom: 0; padding: 0.7rem 0.75rem; }
.reportcard__remark { background: #f6f7fb; border-radius: 10px; padding: 0.7rem 0.9rem; margin: 1rem 0 0.6rem; color: var(--ink); }
.reportcard__scale { font-size: 0.74rem; color: var(--muted); margin: 0.6rem 0 0; }

@media (min-width: 640px) {
  .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kpis--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 900px) {
  .side { overflow-y: auto; }
  .side nav a { padding: 0.42rem 0.8rem; font-size: 0.92rem; }
}
@media print {
  .side, .noprint, .flash { display: none !important; }
  .shell { display: block; }
  .main { padding: 0; max-width: none; }
  body { background: #fff; }
  .receipt, .reportcard { border: 0; padding: 0; max-width: none; }
  .idcards { grid-template-columns: repeat(2, 1fr); gap: 0.6cm; }
  .idcard header, .idcard footer, .dot, .receipt__amount { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
[hidden] { display: none !important; }

/* ---------- admissions plan and enquiry pipeline ---------- */
.pill--visited { background: #e3e8ff; color: #27348b; }
.pill--admitted { background: #1f8a4c; color: #fff; }
.addbox > summary, details.card > summary { cursor: pointer; font-weight: 700; color: var(--navy); }
.addbox[open] > summary { margin-bottom: 1rem; }
.enquiry--due { border-left: 4px solid var(--gold); }
.duenote { color: #8f1220; font-weight: 700; }
.enquiry__form { display: flex; flex-wrap: wrap; gap: 0.6rem 0.9rem; align-items: end; margin: 0.6rem 0; }
.enquiry__form label { font-size: 0.8rem; }
.enquiry__form select, .enquiry__form input[type='date'] { width: auto; padding: 0.4rem 0.6rem; }
.enquiry__note { flex: 1 1 16rem; min-width: 0; }
.enquiry__note input { padding: 0.4rem 0.6rem; }

.plan__eyebrow { font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: #b07c00; margin: 0 0 0.2rem; }
.plan__h { margin: 1.75rem 0 0.75rem; font-size: 1.2rem; scroll-margin-top: 1rem; }
.funnel { list-style: none; margin: 0 0 0.9rem; padding: 0; display: grid; gap: 0.6rem; }
.funnel li { display: grid; grid-template-columns: auto 1fr; gap: 0 0.7rem; align-items: baseline; background: #f1f3fa; border-radius: 12px; padding: 0.8rem 1rem; border-left: 5px solid var(--indigo); }
.funnel li:nth-child(2) { margin-inline: 4%; border-color: #6b78d6; }
.funnel li:nth-child(3) { margin-inline: 8%; border-color: #1f8a4c; background: #e4f5ea; }
.funnel strong { font-size: 1.6rem; color: var(--ink); font-variant-numeric: tabular-nums; }
.funnel span { font-weight: 700; color: var(--ink); }
.funnel em { grid-column: 1 / -1; font-style: normal; font-size: 0.86rem; color: var(--muted); }
.meters { display: grid; gap: 1rem; margin-bottom: 1.25rem; }
.meters .card { margin: 0; }
.meter__top { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.meter__n { margin: 0.3rem 0 0.6rem; color: var(--muted); font-size: 1rem; }
.meter__n strong { font-size: 2.3rem; line-height: 1.1; color: var(--ink); font-variant-numeric: tabular-nums; }
.meter__bar { position: relative; height: 0.9rem; border-radius: 999px; background: #eef0f6; margin-bottom: 0.7rem; }
.meter__bar span { display: block; height: 100%; border-radius: 999px; background: var(--indigo); min-width: 3px; }
.meter--ok .meter__bar span { background: #1f8a4c; }
.meter--behind .meter__bar span { background: #d98a00; }
.meter__bar i { position: absolute; top: -4px; bottom: -4px; width: 3px; background: var(--ink); border-radius: 2px; transform: translateX(-1px); }
.meter p.small { margin-bottom: 0.3rem; }
.weeknums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; margin-bottom: 0.8rem; }
.weeknum { background: #f6f7fb; border-radius: 12px; padding: 0.8rem; display: grid; gap: 0.1rem; border-top: 4px solid #d98a00; min-width: 0; }
.weeknum--ok { border-color: #1f8a4c; }
.weeknum span { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); overflow-wrap: anywhere; }
.weeknum strong { font-size: 1.7rem; color: var(--ink); line-height: 1.2; }
.weeknum em { font-style: normal; font-size: 0.82rem; color: var(--muted); }
.todo { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.todo li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.2rem 1rem; align-items: baseline; padding: 0.55rem 0.8rem; border-radius: 10px; background: #f6f7fb; border-left: 4px solid #1f8a4c; }
.todo--due { border-left-color: var(--gold) !important; background: #fffaf0 !important; }
.todo a { color: var(--ink); text-decoration: none; }
.todo a:hover { text-decoration: underline; }
.todo span { font-size: 0.82rem; color: var(--muted); }
.ticks { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.ticks li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.8rem; align-items: start; padding: 0.7rem 0.8rem; border: 1px solid var(--line); border-radius: 12px; }
.ticks li.is-done { background: #f0f9f3; border-color: #bfe3cc; }
.ticks div { display: grid; gap: 0.1rem; }
.ticks strong { color: var(--ink); }
.ticks li.is-done strong { text-decoration: line-through; text-decoration-color: #7fbf96; }
.ticks span { font-size: 0.88rem; }
.ticks em { font-style: normal; font-size: 0.78rem; color: #14532d; font-weight: 600; }
.tick { width: 1.9rem; height: 1.9rem; border-radius: 8px; border: 2px solid #b9bfd6; background: #fff; cursor: pointer; font-size: 1.1rem; font-weight: 700; color: #fff; line-height: 1; display: grid; place-items: center; padding: 0; }
.tick[aria-pressed='true'] { background: #1f8a4c; border-color: #1f8a4c; }
.plantable td { vertical-align: top; }
.plantable td:first-child strong { display: block; color: var(--ink); }
.month__focus { display: block; font-size: 0.82rem; color: var(--muted); }
.month--now td { background: #fffbee; }
.month--past td { color: var(--muted); }
.plantable tfoot th { font-size: 0.92rem; text-transform: none; letter-spacing: 0; color: var(--ink); border-top: 2px solid var(--navy); border-bottom: 0; padding: 0.7rem 0.75rem; }
.bar--wide { grid-template-columns: minmax(0, 9rem) 1fr auto; }
.rings { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.5rem; font-size: 0.92rem; }
.steps { margin: 0; display: grid; grid-template-columns: minmax(0, 8.5rem) minmax(0, 1fr); gap: 0.6rem 1rem; font-size: 0.92rem; }
.steps dt { font-weight: 700; color: var(--ink); }
.steps dd { margin: 0; }
.steps--qa { grid-template-columns: 1fr; gap: 0.2rem; }
.steps--qa dd { margin-bottom: 0.7rem; }
.rules { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.45rem; font-size: 0.92rem; }
@media (min-width: 640px) {
  .funnel { grid-template-columns: repeat(3, 1fr); }
  .funnel li, .funnel li:nth-child(2), .funnel li:nth-child(3) { margin-inline: 0; }
  .meters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ticks--two { grid-template-columns: 1fr 1fr; }
}
@media print {
  .plan__h { break-after: avoid; }
  .card { break-inside: avoid; }
  .tick, .meter__bar span, .meter__bar i, .funnel li, .month--now td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  details.card:not([open]) { display: none; }
}

/* ---------- Instagram plan ---------- */
.te { font-family: 'Noto Sans Telugu', 'Plus Jakarta Sans', system-ui, sans-serif; line-height: 1.7; }
.te--big { font-size: 1.25rem; font-weight: 700; color: var(--ink); margin: 0; }
.igday { display: grid; gap: 0.7rem; min-width: 0; }
.igday > * { min-width: 0; margin: 0; }
.igday--today { border-left: 5px solid var(--gold); }
.igday__meta { display: flex; flex-wrap: wrap; gap: 0.5rem 0.8rem; align-items: center; color: var(--muted); font-weight: 600; }
.igday__title { margin: 0; font-size: 1.3rem; color: var(--ink); line-height: 1.3; }
.igday__facts { display: grid; grid-template-columns: minmax(0, 6.5rem) minmax(0, 1fr); gap: 0.3rem 1rem; margin: 0; }
.igday__facts dt { color: var(--muted); font-weight: 600; font-size: 0.86rem; }
.igday__facts dd { margin: 0; color: var(--ink); }
.igday__label { font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; color: var(--muted); margin-top: 0.3rem !important; }
.igday__say, .igday__stories { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.35rem; color: var(--ink); }
.igday__stories { color: var(--body); font-size: 0.92rem; }
.igbox { background: #f6f7fb; border: 1px solid var(--line); border-radius: 12px; padding: 0.8rem 0.9rem; display: grid; gap: 0.45rem; }
.igbox p { margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.igbox__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.5rem; font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.igbox__tags { color: var(--indigo) !important; font-size: 0.88rem; }
.igday__tick { margin-top: 0.3rem; }
.igmonth { display: grid; gap: 0.45rem; }
.igmonth > p { margin: 0 0 0.3rem; }
.igrow { border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.igrow > summary { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; gap: 0.8rem; align-items: center; padding: 0.6rem 0.8rem; cursor: pointer; list-style: none; }
.igrow > summary::-webkit-details-marker { display: none; }
.igrow[open] > summary { border-bottom: 1px solid var(--line); background: #f6f7fb; border-radius: 12px 12px 0 0; }
.igrow > .igday { padding: 0.9rem; }
.igrow__date { display: grid; text-align: center; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; color: var(--muted); line-height: 1.1; }
.igrow__date strong { font-size: 1.3rem; color: var(--navy); }
.igrow__text { display: grid; min-width: 0; }
.igrow__text strong { color: var(--ink); overflow-wrap: anywhere; }
.igrow__text span { font-size: 0.84rem; color: var(--muted); }
.igrow__state { font-size: 0.78rem; font-weight: 700; color: #8f1220; white-space: nowrap; }
.igrow--done .igrow__state { color: #14532d; }
.igrow--done { background: #f0f9f3; border-color: #bfe3cc; }
.igrow--today { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(244, 180, 0, 0.3); }
@media print { .igrow { break-inside: avoid; } .igrow > .igday { display: grid !important; } }

/* ---------- office extras: accounts, teacher home, printed letters ---------- */
.classpick { border: 1px solid var(--line); border-radius: 10px; padding: 0.6rem 0.9rem 0.8rem; margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; min-width: 0; }
.classpick legend { font-size: 0.82rem; font-weight: 700; color: var(--muted); padding: 0 0.35rem; }
.acctlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.acctlist > li { border: 1px solid var(--line); border-radius: 12px; padding: 0.9rem 1rem; display: grid; gap: 0.6rem; min-width: 0; }
.acctlist__who { margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.periodlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.periodlist li { display: grid; grid-template-columns: 6.5rem minmax(0, 8rem) minmax(0, 1fr); gap: 0.75rem; align-items: center; padding: 0.45rem 0.7rem; border-radius: 9px; background: #f6f7fb; }
.periodlist__time { font-variant-numeric: tabular-nums; color: var(--muted); font-weight: 600; font-size: 0.88rem; }
.periodlist--cover { background: #fffbee !important; }
.grid--4 > *, .grid--3 > *, .grid--2 > * { min-width: 0; }

.letter { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 2.25rem 2.5rem; max-width: 800px; margin-bottom: 1.25rem; color: #111; line-height: 1.75; }
.letter > header { display: flex; gap: 1.1rem; align-items: center; border-bottom: 2.5px solid var(--navy); padding-bottom: 1rem; }
.letter > header img { width: 150px; height: auto; }
.letter > header div { display: grid; font-size: 0.9rem; }
.letter > header strong { font-size: 1.45rem; color: var(--navy); line-height: 1.2; }
.letter__meta { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 1rem 0 0; font-size: 0.95rem; }
.letter h2 { text-align: center; text-transform: uppercase; letter-spacing: 0.14em; font-size: 1.2rem; margin: 1.6rem 0 1.4rem; text-decoration: underline; text-underline-offset: 0.35em; color: #111; }
.letter__body { font-size: 1.06rem; text-align: justify; margin: 0 0 1rem; }
.letter__table { width: 100%; border-collapse: collapse; margin-bottom: 1.1rem; font-size: 0.98rem; }
.letter__table td, .letter__table th { border: 1px solid #b9bfd3; padding: 0.45rem 0.65rem; text-align: left; vertical-align: top; background: none; }
.letter__table th { font-weight: 600; width: 46%; color: #111; text-transform: none; letter-spacing: 0; font-size: inherit; }
.letter__table td:first-child { width: 2.4rem; color: #555; }
.letter__foot { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1rem; align-items: end; margin-top: 3.2rem; font-size: 0.86rem; }
.letter__qr { display: flex; gap: 0.6rem; align-items: center; color: #555; font-size: 0.72rem; line-height: 1.35; overflow-wrap: anywhere; }
.letter__qr svg { width: 84px; height: 84px; flex: none; }
.letter__sign { display: grid; text-align: center; color: #555; border-top: 1px solid #999; padding-top: 0.35rem; }
.letter__sign strong { color: #111; }
@media (max-width: 640px) { .letter { padding: 1.25rem 1.1rem; } .letter > header img { width: 96px; } .letter__foot { grid-template-columns: 1fr; } .periodlist li { grid-template-columns: 5.6rem minmax(0, 1fr); } .periodlist li > :last-child { grid-column: 2; } }
@media print { .letter { border: 0; padding: 0; max-width: none; } @page { margin: 1.6cm; } }
.seg--4 { grid-template-columns: repeat(4, 1fr); }
.seg input:checked + .seg--V { background: var(--indigo); border-color: var(--indigo); color: #fff; }
.slipedit summary { cursor: pointer; color: var(--indigo); font-weight: 600; font-size: 0.88rem; }
.slipedit[open] { margin-top: 0.5rem; padding: 0.8rem; border: 1px solid var(--line); border-radius: 10px; background: #f9fafc; min-width: 16rem; }
.slipedit[open] summary { margin-bottom: 0.6rem; }
.sliptable { width: 100%; border-collapse: collapse; margin: 1.1rem 0; }
.sliptable th, .sliptable td { border: 1px solid var(--line); padding: 0.45rem 0.6rem; text-align: left; }
.sliptable .num { text-align: right; }
tr.is-void td { color: var(--muted); text-decoration: line-through; }
tr.is-void td.actions { text-decoration: none; }
.grouprow th { background: #f3f4fa; color: var(--navy); font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; }
.shoptotal { font-size: 1.15rem; color: var(--ink); }
.denoms { border: 1px solid var(--line); border-radius: 10px; padding: 0.6rem 0.8rem 0.8rem; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr)); gap: 0.5rem 0.7rem; min-width: 0; }
.denoms legend { font-size: 0.82rem; font-weight: 700; color: var(--muted); padding: 0 0.35rem; }
.denoms label { font-size: 0.82rem; display: grid; gap: 0.2rem; }
.denoms input { padding: 0.35rem 0.5rem; }
.walist li > strong { white-space: nowrap; }

/* ---------- timetable ---------- */
.tt { min-width: 760px; table-layout: fixed; }
.tt th, .tt td { vertical-align: top; padding: 0.4rem; }
.tt tbody th { width: 6.6rem; font-size: 0.86rem; color: var(--ink); text-transform: none; letter-spacing: 0; background: #f6f7fb; }
.tt tbody th span { display: block; font-weight: 500; color: var(--muted); font-size: 0.76rem; font-variant-numeric: tabular-nums; }
.tt td { display: table-cell; }
.tt td input, .tt td select { width: 100%; padding: 0.3rem 0.4rem; font-size: 0.82rem; margin-bottom: 0.25rem; }
.tt td strong { display: block; color: var(--ink); font-size: 0.9rem; }
.tt td span { display: block; color: var(--muted); font-size: 0.8rem; }
.tt__today { background: #fffbee; }
.tt__break td { text-align: center; color: var(--muted); font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; background: #f6f7fb; padding: 0.25rem; }
.chip[aria-current='true'] { background: var(--navy); color: #fff; }
a.chip { text-decoration: none; color: inherit; }
.printonly { display: none; }
@media print { .printonly { display: inline; } .tt { min-width: 0; } .tt td input, .tt td select { border: 0; padding: 0; appearance: none; -webkit-appearance: none; background: none; font-weight: 600; } .tt__today { background: none; } }
a.chip, span.chip { padding-right: 0.8rem; }

/* ---------- learning passport ---------- */
.projgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.9rem; }
.proj { margin: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; display: grid; align-content: start; min-width: 0; }
.proj img, .proj__blank { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.proj__blank { background: linear-gradient(135deg, #eef0fb, #dfe4fa); color: var(--indigo); font-weight: 700; display: grid; place-items: center; }
.proj figcaption { padding: 0.6rem 0.7rem 0.7rem; display: grid; gap: 0.2rem; font-size: 0.9rem; overflow-wrap: anywhere; }
.classpick legend .linkbtn { margin-left: 0.5rem; font-size: 0.8rem; }

/* ---------- needs attention, ratings, question papers ---------- */
.flagpill { display: inline-block; padding: 0.18rem 0.65rem; border-radius: 999px; font-size: 0.8rem; font-weight: 700; margin: 0 0.2rem 0.3rem 0; }
.flagpill--attendance { background: #fde8ea; color: #8f1220; }
.flagpill--marks { background: #fff1c9; color: #7a5600; }
.flagpill--fees { background: #ffe3d6; color: #8a3a0c; }
.flagpill--ok { background: #e4f5ea; color: #14532d; }
.paperprint__body { white-space: pre-wrap; font-size: 1.02rem; line-height: 1.75; color: #111; overflow-wrap: anywhere; margin-top: 1.2rem; }
.paperprint .letter__meta { gap: 0.4rem 1.5rem; }
.paperprint h2 { text-decoration: none; margin: 1.1rem 0 0.2rem; }
button[disabled] { opacity: 0.6; cursor: progress; }
.modellist { display: flex; flex-wrap: wrap; gap: 0.35rem; } .modellist code { background: #f3f4fa; border-radius: 6px; padding: 0.1rem 0.4rem; font-size: 0.8rem; overflow-wrap: anywhere; }

/* ---------- families, meetings, syllabus, library, ask ---------- */
.famrow { display: flex; flex-wrap: wrap; gap: 0.6rem 1.2rem; align-items: center; padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.famrow:last-child { border-bottom: 0; }
.slotlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.slotlist li { display: grid; grid-template-columns: 3.6rem minmax(0, 1fr) auto; gap: 0.6rem; align-items: center; padding: 0.35rem 0.6rem; border-radius: 8px; background: #eef6f0; }
.slotlist li.is-free { background: #f6f7fb; color: var(--muted); }
.slotlist li.is-free strong { font-weight: 500; color: var(--muted); }
.slotlist span { font-variant-numeric: tabular-nums; font-weight: 600; }
.subhead { font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin: 0 0 0.5rem; }
.chapterlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.3rem; }
.chapterlist li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.3rem 1rem; align-items: center; padding: 0.45rem 0.7rem; border-radius: 9px; background: #f6f7fb; }
.chapterlist li.is-done { background: #eef6f0; }
.chapterlist li > span { min-width: 0; overflow-wrap: anywhere; }
.booklabels { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0.6rem; }
.booklabel { display: flex; gap: 0.6rem; align-items: center; border: 1px dashed #b9bfd3; border-radius: 8px; padding: 0.5rem; background: #fff; break-inside: avoid; min-width: 0; }
.booklabel svg { width: 72px; height: 72px; flex: none; }
.booklabel div { display: grid; min-width: 0; font-size: 0.78rem; }
.booklabel strong { font-size: 1.15rem; color: #111; }
.booklabel span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booklabel em { font-style: normal; color: var(--muted); font-size: 0.7rem; }
.scanbox { position: fixed; inset: 0; background: rgba(10, 14, 40, 0.92); z-index: 50; display: grid; place-content: center; gap: 1rem; justify-items: center; padding: 1rem; }
.scanbox video { width: min(92vw, 420px); border-radius: 14px; background: #000; }
.nowrap { white-space: nowrap; }
.askhints { display: flex; flex-wrap: wrap; gap: 0.3rem 0.9rem; align-items: baseline; }
.askquery { white-space: pre-wrap; overflow-wrap: anywhere; background: #f6f7fb; border-radius: 8px; padding: 0.7rem; font-size: 0.8rem; margin: 0.5rem 0 0; }
@media print { .booklabels { grid-template-columns: repeat(3, 1fr); gap: 0.3cm; } }

/* ==========================================================================
   Admin shell, second design: a grouped menu that opens and closes, a search
   box, and a drawer menu on phones. These rules come last, so they win.
   ========================================================================== */
body { background: #f3f4f9; }
.navtoggle { position: absolute; opacity: 0; pointer-events: none; }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 0.6rem; background: var(--navy-deep); color: #fff; padding: 0.55rem 0.8rem; }
.topbar__brand { color: #fff; font-weight: 700; text-decoration: none; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar__menu, .topbar__search { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 10px; cursor: pointer; color: #fff; }
.topbar__menu:hover, .topbar__search:hover { background: rgba(255, 255, 255, 0.12); }
.topbar .icon { width: 1.5rem; height: 1.5rem; }
.shell { display: block; min-height: 100vh; }
.side { position: fixed; z-index: 40; inset: 0 auto 0 0; width: min(86vw, 300px); height: 100dvh; overflow-y: auto; overscroll-behavior: contain; visibility: hidden; padding: 1rem 0.8rem 1.2rem; gap: 0.8rem; flex-wrap: nowrap; scrollbar-width: thin; scrollbar-color: #3a4384 transparent; }
.shade { display: none; position: fixed; inset: 0; z-index: 35; background: rgba(10, 14, 40, 0.5); }
.navtoggle:checked ~ .shell .side { visibility: visible; }
.navtoggle:checked ~ .shell .shade { display: block; }
.side__brand { padding: 0.2rem 0.5rem; }
.side__search { position: relative; display: flex; align-items: center; gap: 0.45rem; background: rgba(255, 255, 255, 0.09); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 10px; padding: 0 0.6rem; }
.side__search .icon { width: 1.05rem; height: 1.05rem; flex: none; color: #9aa3d6; }
.side__search input { flex: 1; min-width: 0; background: none; border: 0; color: #fff; font: inherit; font-size: 0.88rem; padding: 0.55rem 0; outline: none; }
.side__search input::placeholder { color: #9aa3d6; }
.side__search:focus-within { border-color: var(--gold); background: rgba(255, 255, 255, 0.14); }
.side__results { position: absolute; z-index: 5; left: 0; right: 0; top: calc(100% + 0.35rem); list-style: none; margin: 0; padding: 0.3rem; background: #fff; border-radius: 12px; box-shadow: 0 14px 40px rgba(10, 14, 40, 0.35); max-height: 60vh; overflow-y: auto; }
.side__results a { display: grid; padding: 0.5rem 0.65rem; border-radius: 8px; text-decoration: none; color: var(--ink); font-weight: 600; font-size: 0.9rem; }
.side__results a span { font-weight: 400; color: var(--muted); font-size: 0.78rem; }
.side__results a:hover, .side__results a.is-on { background: #eef0fb; }
.side__results li.none { padding: 0.5rem 0.65rem; color: var(--muted); font-size: 0.86rem; }
.side nav { display: grid; gap: 0.1rem; flex: none; }
.side nav a { padding: 0.5rem 0.7rem; border-radius: 9px; font-size: 0.9rem; white-space: normal; }
.side nav .navtop { justify-content: flex-start; gap: 0.6rem; color: #e6e9fb; }
.side nav .icon { width: 1.15rem; height: 1.15rem; flex: none; }
.navgroup { border-radius: 10px; }
.navgroup summary { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.7rem; border-radius: 9px; cursor: pointer; list-style: none; color: #e6e9fb; font-weight: 600; font-size: 0.9rem; user-select: none; }
.navgroup summary::-webkit-details-marker { display: none; }
.navgroup summary > span { flex: 1; }
.navgroup summary::after { content: ''; width: 0.45rem; height: 0.45rem; border-right: 2px solid #8089bd; border-bottom: 2px solid #8089bd; transform: rotate(-45deg); transition: transform 0.15s ease; margin-right: 0.2rem; }
.navgroup[open] summary::after { transform: rotate(45deg); }
.navgroup summary:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.navgroup[open] { background: rgba(255, 255, 255, 0.05); padding-bottom: 0.3rem; margin: 0.15rem 0; }
.navgroup > a { margin: 0 0.3rem 0 2.05rem; padding: 0.4rem 0.6rem; font-weight: 500; font-size: 0.875rem; color: #c5cbee; }
.side nav a[aria-current='page'] { background: var(--gold); color: var(--navy-deep); font-weight: 700; }
.side__foot { margin-top: auto; padding: 0.8rem 0.5rem 0; border-top: 1px solid rgba(255, 255, 255, 0.12); flex-direction: column; align-items: flex-start; gap: 0.45rem; }
.side__me { display: grid; color: #9aa3d6; font-size: 0.78rem; }
.side__me strong { color: #fff; font-size: 0.92rem; }
.main { padding: 1.1rem 0.9rem 3.5rem; max-width: 1240px; }
.pagetitle h1 { font-size: 1.45rem; letter-spacing: -0.01em; }
.pagetitle > p.muted, .pagetitle > div > p.muted { max-width: 62rem; }
.card { border-radius: 16px; border-color: #e4e7f2; box-shadow: 0 1px 2px rgba(19, 26, 66, 0.04); }
.kpi { border-radius: 16px; box-shadow: 0 1px 2px rgba(19, 26, 66, 0.04); }
.tablewrap table tbody tr:hover td { background: #fafbff; }
.flash { border-radius: 12px; }
@media (min-width: 1000px) {
  .topbar, .shade { display: none !important; }
  .shell { display: grid; grid-template-columns: 264px minmax(0, 1fr); }
  .side { position: sticky; top: 0; visibility: visible; width: auto; height: 100vh; padding: 1.25rem 0.8rem 1rem; }
  .main { padding: 1.9rem 2.25rem 4rem; }
  .pagetitle h1 { font-size: 1.7rem; }
}
@media print { .topbar, .shade { display: none !important; } .shell { display: block; } }

/* quick actions on the overview */
.quick { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.6rem; margin-bottom: 1.25rem; }
.quick a { display: flex; align-items: center; gap: 0.6rem; background: #fff; border: 1px solid #e4e7f2; border-radius: 14px; padding: 0.75rem 0.85rem; text-decoration: none; color: var(--ink); font-weight: 600; font-size: 0.9rem; line-height: 1.25; min-width: 0; }
.quick a:hover { border-color: var(--indigo); box-shadow: 0 4px 14px rgba(51, 64, 156, 0.12); }
.quick .icon { flex: none; width: 2.1rem; height: 2.1rem; padding: 0.45rem; border-radius: 10px; background: #eef0fb; color: var(--indigo); }
.greet { color: var(--muted); margin: 0 0 0.2rem; font-weight: 600; }
.kpi strong { font-size: clamp(1.2rem, 5.6vw, 1.75rem); white-space: nowrap; }
.kpi strong.kpi__small { white-space: normal; }
.todo li { align-items: center; }

/* ---------- admissions tools, summary, monthly report ---------- */
.followup { display: flex; flex-wrap: wrap; gap: 0.5rem 0.9rem; align-items: center; background: #eef6f0; border-radius: 10px; padding: 0.55rem 0.8rem; margin: 0.5rem 0; }
.followup > span { flex: 1 1 16rem; min-width: 0; }
.qrsheet { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 2rem 1.5rem; max-width: 520px; text-align: center; display: grid; gap: 0.6rem; justify-items: center; }
.qrsheet__code svg { width: min(100%, 340px); height: auto; display: block; }
.qrsheet__call { font-size: 1.4rem; font-weight: 700; color: var(--navy); margin: 0; display: grid; }
.qrsheet__call span { font-family: 'Noto Sans Telugu', sans-serif; font-size: 1.1rem; font-weight: 600; }
.qrsheet__link { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.seatbox { display: grid; gap: 0.15rem; font-size: 0.86rem; font-weight: 600; width: 6.5rem; }
.seatbox input { padding: 0.35rem 0.5rem; }
.summarytext { white-space: pre-wrap; overflow-wrap: anywhere; background: #f6f7fb; border-radius: 12px; padding: 0.9rem 1rem; margin: 0 0 0.8rem; font: inherit; color: var(--ink); line-height: 1.7; }
.monthly { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 1.5rem; }
.monthly > header { display: flex; gap: 1rem; align-items: center; border-bottom: 2px solid var(--navy); padding-bottom: 0.8rem; margin-bottom: 1rem; }
.monthly > header img { width: 120px; height: auto; }
.monthly > header div { display: grid; }
.monthly > header strong { font-size: 1.2rem; color: var(--navy); }
.monthly__grid { display: grid; gap: 1.2rem 2rem; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); margin-bottom: 1.2rem; }
.monthly h2 { font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--indigo); margin-bottom: 0.5rem; }
.monthly .facts { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: 0.25rem 0.8rem; }
@media print { .monthly, .qrsheet { border: 0; padding: 0; } .monthly__grid { grid-template-columns: 1fr 1fr; } }
.twostep { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; margin-top: 0.75rem; }
.twostep__qr svg { width: 180px; height: 180px; display: block; background: #fff; }
.codes { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.codes code { font-size: 1rem; padding: 0.3rem 0.6rem; letter-spacing: 0.04em; }
.weeknote { display: grid; gap: 0.7rem; }
.weeknote .card__head { margin-bottom: 0; }
.weeknote h2 { margin: 0; }
.prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
textarea.te { font-family: 'Noto Sans Telugu', 'Plus Jakarta Sans', sans-serif; line-height: 1.7; }

/* ---------- messages, forecast ---------- */
.thread { display: grid; gap: 0.6rem; max-height: 60vh; overflow-y: auto; padding: 0.2rem; }
.bubble { max-width: min(34rem, 88%); padding: 0.6rem 0.8rem; border-radius: 14px; background: #f1f2f8; display: grid; gap: 0.25rem; justify-self: start; }
.bubble--school { background: #e3e8ff; justify-self: end; }
.bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--ink); }
.bubble__tr { font-size: 0.86rem; color: var(--body) !important; border-top: 1px dashed #c3c8dd; padding-top: 0.25rem; }
.bubble span { font-size: 0.74rem; color: var(--muted); }
.meterline { position: relative; height: 0.9rem; background: #eef0f6; border-radius: 999px; margin: 0.4rem 0 0.7rem; }
.meterline span { display: block; height: 100%; background: #1f8a4c; border-radius: 999px; min-width: 2px; }
.meterline i { position: absolute; top: -0.3rem; width: 3px; height: 1.5rem; background: var(--navy); border-radius: 2px; transform: translateX(-1px); }

/* ---------- chapter library, homework photos ---------- */
.videobox { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #0d1230; }
.videobox iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.handins { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 0.9rem; }
.handin { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 0.6rem; display: grid; gap: 0.45rem; align-content: start; min-width: 0; }
.handin img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 8px; background: #f0f2f8; display: block; }
.handin--ok { border-color: #9fd5b3; }
.handin--redo { border-color: #f0c66a; }
.handin__gone { display: grid; place-items: center; aspect-ratio: 3 / 4; border-radius: 8px; background: #f0f2f8; color: var(--muted); font-size: 0.85rem; }
.att input[type='text'] { margin-top: 0.3rem; padding: 0.42rem 0.6rem; font-size: 0.86rem; }
details > summary { cursor: pointer; font-weight: 600; color: var(--ink); }

/* ---------- staff profiles: each sign-in has its own colour, so nobody mistakes one for another ---------- */
[data-tone='plum'] { --navy: #4a1d5c; --navy-deep: #33123f; --indigo: #7a3aa0; }
[data-tone='green'] { --navy: #14532d; --navy-deep: #0c3a1f; --indigo: #1b7a43; }
[data-tone='teal'] { --navy: #0f4c5c; --navy-deep: #093540; --indigo: #12718a; }
[data-tone='amber'] { --navy: #6b3410; --navy-deep: #4a2409; --indigo: #a2541a; }
[data-tone='slate'] { --navy: #2f3b4c; --navy-deep: #1f2835; --indigo: #47607f; }
.topbar__brand span { margin-left: 0.5rem; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); }
.login__kind { display: inline-block; margin: 0 0 0.6rem; padding: 0.15rem 0.7rem; border-radius: 999px; background: var(--navy); color: #fff; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.login--wide { width: min(100%, 640px); }
.doors { list-style: none; margin: 1.25rem 0 1rem; padding: 0; display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.doors a { display: grid; gap: 0.2rem; height: 100%; align-content: start; padding: 0.85rem 1rem; border-radius: 12px; border: 1px solid var(--line); border-left: 6px solid var(--navy); text-decoration: none; color: var(--body); }
.doors a:hover { background: var(--bg); }
.doors strong { color: var(--navy); font-size: 1.02rem; }
.doors span { font-size: 0.84rem; color: var(--muted); }

/* ---------- Reel and Shorts maker ---------- */
.ed { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
.ed fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.ed [hidden] { display: none !important; }
.ed__stage { display: grid; gap: 0.6rem; min-width: 0; background: #fff; border: 1px solid #e4e7f2; border-radius: 16px; padding: 0.9rem; box-shadow: 0 1px 2px rgba(19, 26, 66, 0.04); }
.ed__screen { position: relative; height: min(586px, max(300px, calc(100vh - 19rem))); width: auto; max-width: 100%; margin: 0 auto; aspect-ratio: var(--ar, 9 / 16); background: #0b0f2a; border-radius: 14px; overflow: hidden; }
.ed__screen[data-wide] { height: auto; width: 100%; }
.ed__screen canvas, .ed__result { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ed__screen canvas { cursor: pointer; -webkit-user-select: none; user-select: none; }
.ed__result { background: #0b0f2a; }
.ed__safe { position: absolute; inset: 0; pointer-events: none; }
.ed__safe i { position: absolute; background: repeating-linear-gradient(135deg, rgba(244, 180, 0, 0.3) 0 6px, rgba(244, 180, 0, 0.1) 6px 12px); }
.ed__safe-top { left: 0; right: 0; top: 0; height: 11%; }
.ed__safe-foot { left: 0; right: 0; bottom: 0; height: 19%; }
.ed__safe-side { right: 0; top: 11%; bottom: 19%; width: 15%; }
.ed__safe span { position: absolute; left: 0.5rem; right: 0.5rem; bottom: 0.4rem; font-size: 0.66rem; line-height: 1.25; color: #fff; text-shadow: 0 1px 2px #000; }
.ed__transport { display: flex; align-items: center; gap: 0.55rem; min-width: 0; }
.ed__round { flex: none; width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 0; background: var(--navy); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.ed__round:hover { background: var(--navy-deep); }
.ed__round span { display: inline-flex; }
.ed__round--light { width: 2.2rem; height: 2.2rem; background: #fff; color: var(--navy); border: 1px solid var(--line); }
.ed__round--light:hover { background: #f1f3fa; }
.ed__round:disabled { opacity: 0.45; cursor: default; }
.ed__time { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--ink); font-size: 0.9rem; white-space: nowrap; }
.ed__guide { margin-left: auto; display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; font-weight: 600; color: var(--muted); white-space: nowrap; }
.ed__guide input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--navy); }
.ed input[type='range'] { width: 100%; margin: 0.45rem 0 0; accent-color: var(--navy); display: block; }
.ed__seek { margin: 0 !important; }
.ed__bar { height: 8px; margin: 0; border-radius: 999px; background: var(--line); overflow: hidden; }
.ed__bar span { display: block; height: 100%; width: 0; background: var(--gold); }
.ed__status { margin: 0; min-height: 2.6em; }
.ed__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.ed__stage .ed__actions .btn { flex: 1 1 auto; text-align: center; }
.ed__done { display: grid; gap: 0.6rem; padding-top: 0.7rem; border-top: 1px solid var(--line); }
.ed__done p { margin: 0; }
.ed__inline { display: inline-flex; align-items: center; gap: 0.45rem; font-weight: 600; }
.ed__inline select { width: auto; margin: 0; }

.ed__work { display: grid; gap: 1.25rem; min-width: 0; }
.ed__work .card { margin: 0; min-width: 0; }
.ed__tl { display: grid; gap: 0.7rem; }
.ed__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.ed__tools-group { display: inline-flex; align-items: center; gap: 0.3rem; }
.ed__zoom { margin-left: auto; }
.ed__iconbtn { min-width: 2.1rem; padding-inline: 0.5rem; font-size: 1rem; line-height: 1; }
.ed .btn:disabled { opacity: 0.45; cursor: default; }
.shorts__pick { cursor: pointer; }
.ed__length, .ed__keys { margin: 0; }
.ed__kept { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.6rem 1rem; padding: 0.75rem 0.95rem; border: 1px solid var(--gold); border-radius: 12px; background: #fff8e1; }
.ed__kept p, .ed__keptnote { margin: 0; }
.ed__keptnote { color: var(--red); }
.shorts__kept summary { cursor: pointer; font-weight: 700; color: var(--red); }

/* The strip of clips */
.tl { position: relative; overflow-x: auto; overflow-y: hidden; border: 1px solid var(--line); border-radius: 12px; background: #f4f5fa; padding: 0 12px 10px; min-height: 104px; }
.tl.is-drop { outline: 3px dashed var(--gold); outline-offset: -3px; }
.tl__lanes { position: relative; min-width: 100%; }
.tl__ruler { position: relative; height: 24px; cursor: pointer; touch-action: none; border-bottom: 1px solid var(--line); margin-bottom: 6px; }
.tl__ruler span { position: absolute; top: 4px; padding-left: 4px; border-left: 1px solid #b9bfd3; font-size: 0.66rem; line-height: 1.1; height: 20px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; pointer-events: none; }
.tl__track { position: relative; }
.tl__track--clips { height: 60px; }
.tl__clip { position: absolute; top: 0; height: 58px; border-radius: 8px; overflow: hidden; background: var(--navy); border: 2px solid transparent; cursor: grab; touch-action: pan-x; -webkit-user-select: none; user-select: none; }
.tl__clip canvas { width: 100%; height: 100%; display: block; pointer-events: none; }
.tl__clip span { position: absolute; left: 4px; bottom: 3px; max-width: calc(100% - 8px); padding: 0 0.3rem; border-radius: 4px; background: rgba(11, 15, 42, 0.72); color: #fff; font-size: 0.66rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.tl__clip.is-on { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); z-index: 2; }
.tl__clip.is-on span { left: 18px; max-width: calc(100% - 36px); }
.tl__clip--over { opacity: 0.45; background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgba(255, 255, 255, 0.35) 6px 12px); }
.tl__clip--end { background: var(--navy-deep); cursor: default; display: flex; align-items: center; justify-content: center; color: #c5cbee; font-size: 0.66rem; font-weight: 600; text-align: center; line-height: 1.15; padding: 0 2px; }
.tl__grip { position: absolute; top: 0; bottom: 0; width: 14px; background: var(--gold); cursor: ew-resize; touch-action: none; z-index: 3; }
.tl__grip::after { content: ''; position: absolute; left: 6px; top: 30%; bottom: 30%; width: 2px; border-radius: 2px; background: var(--navy-deep); }
.tl__grip--l { left: 0; }
.tl__grip--r { right: 0; }
.tl__drop { position: absolute; top: -2px; height: 62px; width: 3px; margin-left: -2px; border-radius: 2px; background: var(--red); z-index: 4; pointer-events: none; }
.tl__track--text, .tl__track--sound { margin-top: 4px; }
.tl__row { position: relative; height: 22px; margin-top: 2px; }
.tl__text { position: absolute; top: 0; height: 20px; padding: 0 9px; border-radius: 6px; background: #e3e8ff; border: 1px solid #aab3ee; color: #27348b; font-size: 0.68rem; font-weight: 600; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none; }
.tl__text.is-on { background: #fff1c9; border-color: var(--gold); color: #5c4100; }
.tl__text--fixed { background: #eceef6; border-color: #cdd2e2; color: var(--muted); cursor: default; }
.tl__text--stick { background: #fdebd3; border-color: #f0c48a; color: #7a4300; }
.tl__text i { position: absolute; top: 0; bottom: 0; width: 7px; cursor: ew-resize; background: rgba(51, 64, 156, 0.35); }
.tl__text i:first-of-type { left: 0; }
.tl__text i:last-of-type { right: 0; }
.tl__sound { position: absolute; top: 0; height: 18px; padding: 0 8px; border-radius: 6px; background: #e4f5ea; border: 1px solid #a9d8b9; color: #14532d; font-size: 0.66rem; font-weight: 600; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl__sound--voice { background: #fde8ea; border-color: #f0b3ba; color: #8f1220; }
.tl__head { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; margin-left: -1px; background: var(--red); pointer-events: none; z-index: 5; will-change: transform; }
.tl__head::before { content: ''; position: absolute; top: 0; left: -5px; width: 12px; height: 12px; border-radius: 2px 2px 50% 50%; background: var(--red); }
.tl__empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; margin: 0; padding: 0 1rem; pointer-events: none; }

/* The tools */
.ed__tabs { display: flex; gap: 0.3rem; margin-bottom: 1rem; padding: 0.25rem; background: #f1f3fa; border-radius: 12px; overflow-x: auto; }
.ed__tabs button { flex: 1 0 auto; padding: 0.5rem 0.9rem; border: 0; border-radius: 9px; background: transparent; color: var(--body); font: 700 0.9rem/1.2 inherit; font-family: inherit; cursor: pointer; }
.ed__tabs button[aria-selected='true'] { background: #fff; color: var(--navy); box-shadow: 0 1px 3px rgba(19, 26, 66, 0.14); }
@media (max-width: 520px) { .ed__tabs button { padding: 0.5rem 0.5rem; font-size: 0.84rem; } }
.ed__panel { display: grid; gap: 1rem; min-width: 0; }
.ed__panel > p { margin: 0; }
.ed__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.85rem 1rem; align-items: start; }
.ed__panel select, .ed__panel input[type='number'], .ed__panel input[type='text'] { height: 2.75rem; padding-block: 0; }
.ed__panel input[type='range'] { height: 2.75rem; margin-top: 0; }
.ed__panel input[type='file'] { margin-top: 0.35rem; padding: 0.55rem 0; max-width: 100%; }
.ed .btn { font-size: 0.9rem; font-weight: 700; line-height: 1.2; }
.ed .btn--small { font-size: 0.84rem; }
.ed__grid > *, .ed__panel label { min-width: 0; }
.ed__span { grid-column: 1 / -1; }
.ed__btns { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ed__checks { display: grid; gap: 0.55rem; }
.ed .check { display: flex; align-items: flex-start; gap: 0.5rem; line-height: 1.4; }
.ed .check input { flex: none; margin-top: 0.14rem; }
.ed__block { display: grid; gap: 0.6rem; padding: 0.85rem 0.95rem; border: 1px solid var(--line); border-radius: 12px; background: #fafbff; min-width: 0; }
.ed__block p { margin: 0; }
.ed__blockhead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem; }
[data-clip-box] { display: grid; gap: 0.9rem; min-width: 0; }
[data-clip-box] > p { margin: 0; }
.ed__cliphead { display: grid; gap: 0.1rem; min-width: 0; }
.ed__cliphead strong { color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed__texts { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.ed__texts:empty { display: none; }
.ed__texts li { display: grid; gap: 0.5rem; padding: 0.7rem; border: 1px solid var(--line); border-radius: 10px; background: #fff; min-width: 0; }
.ed__texts li.is-on { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.ed__texts .ed__grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 0.5rem 0.7rem; }
.ed__texts label { font-size: 0.8rem; }
.ed__texts input[type='text'], .ed__texts input[type='number'], .ed__texts select { height: 2.3rem; padding: 0 0.55rem; }
.ed__texts .btn { align-self: end; justify-self: start; }
.ed__texts input[type='range'] { height: 2.3rem; }
.ed__stickname { color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed__emoji { display: grid; grid-template-columns: repeat(auto-fill, minmax(2.75rem, 1fr)); gap: 0.35rem; }
.ed__emoji button { height: 2.75rem; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 1.45rem; line-height: 1; cursor: pointer; }
.ed__emoji button:hover, .ed__emoji button:focus-visible { border-color: var(--gold); background: #fff8e1; }
.ed__emoji button:disabled { opacity: 0.45; cursor: default; }
@media (min-width: 1000px) {
  .ed { grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); }
  .ed__stage { position: sticky; top: 1rem; }
}
@media (max-width: 999px) {
  .ed__screen[data-wide] { max-width: 420px; }
}
@media (max-width: 520px) {
  .ed__tabs button { flex: 1 1 0; min-width: 0; padding: 0.5rem 0.2rem; font-size: 0.82rem; }
  .ed__zoom { margin-left: 0; }
}

/* Getting started */
.startbar { display: grid; gap: 0.5rem; }
.startbar p { margin: 0; }
.startbar__meter { height: 10px; border-radius: 999px; background: #eceef6; overflow: hidden; }
.startbar__meter span { display: block; height: 100%; background: #1f8a4c; border-radius: 999px; }
.startlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.startstep { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.4rem 0.8rem; align-items: start; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 0.9rem 1rem; }
.startstep .btn { grid-column: 2; justify-self: start; }
.startstep__mark { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: #eceef6; color: var(--ink); font-weight: 700; }
.startstep__mark svg { width: 1.1rem; height: 1.1rem; }
.startstep h2 { font-size: 1rem; margin: 0.25rem 0 0.2rem; }
.startstep p { margin: 0; font-size: 0.92rem; }
.startstep.is-done .startstep__mark { background: #1f8a4c; color: #fff; }
.startstep.is-done h2 { color: var(--muted); }
.startstep.is-next { border-color: var(--navy); box-shadow: 0 0 0 2px rgba(27, 37, 89, 0.08); }
.startnote { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; background: #fff8e1; border: 1px solid #f2dc9b; border-radius: 14px; padding: 0.8rem 1rem; margin-bottom: 1.25rem; color: var(--ink); }
.startnote p { margin: 0; flex: 1 1 16rem; }
@media (min-width: 700px) {
  .startstep { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
  .startstep .btn { grid-column: 3; }
}

/* Certificate of fees paid */
.feecert__table th { width: auto; font-size: 0.86rem; }
.feecert__table td:first-child { width: auto; color: #111; }
.feecert__table .num { text-align: right; }
.feecert__note { font-size: 0.86rem; color: #555; margin: 0 0 1rem; }
.feecert__made { font-size: 0.78rem; color: #555; line-height: 1.4; }
.feecert .letter__foot { grid-template-columns: 1.3fr 1fr 1fr; }
@media (max-width: 640px) { .feecert .letter__foot { grid-template-columns: 1fr; } .feecert__table { font-size: 0.82rem; } .feecert__table td, .feecert__table th { padding: 0.35rem 0.4rem; } }

/* Exam date sheet, hall tickets and seating plan */
.hallsheet input { min-width: 0; }
.hallsheet input[type='time'] { width: 8rem; }
.hallsheet input[type='date'] { width: 10.5rem; }
.hallsheet td { vertical-align: middle; }
.hallclasses { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: 0.5rem 1rem; }
.halltickets { display: grid; gap: 1rem; max-width: 800px; }
.hallticket { background: #fff; border: 1.5px solid #111; border-radius: 6px; padding: 1rem 1.2rem; color: #111; break-inside: avoid; }
.hallticket > header { display: flex; align-items: center; gap: 0.8rem; border-bottom: 2px solid var(--navy); padding-bottom: 0.6rem; }
.hallticket > header img { width: 86px; height: auto; }
.hallticket > header div { display: grid; font-size: 0.8rem; flex: 1; min-width: 0; }
.hallticket > header strong { font-size: 1.15rem; color: var(--navy); line-height: 1.2; }
.hallticket > header b { border: 1.5px solid #111; padding: 0.2rem 0.6rem; font-size: 0.8rem; letter-spacing: 0.1em; white-space: nowrap; }
.hallticket h2 { text-align: center; font-size: 1rem; margin: 0.7rem 0; color: #111; }
.hallticket__who { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem 1.2rem; margin: 0 0 0.7rem; font-size: 0.9rem; }
.hallticket__who div { display: flex; gap: 0.5rem; border-bottom: 1px dotted #999; padding-bottom: 0.15rem; min-width: 0; }
.hallticket__who dt { color: #555; white-space: nowrap; }
.hallticket__who dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.hallticket table { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.hallticket th, .hallticket td { border: 1px solid #999; padding: 0.25rem 0.5rem; text-align: left; background: none; color: #111; text-transform: none; letter-spacing: 0; font-size: inherit; }
.hallticket__rules { font-size: 0.76rem; color: #444; margin: 0.6rem 0 0; }
.hallticket > footer { display: flex; justify-content: space-between; margin-top: 2rem; font-size: 0.8rem; color: #444; }
.hallticket > footer span { border-top: 1px solid #777; padding-top: 0.2rem; min-width: 9rem; text-align: center; }
@media (max-width: 560px) { .hallticket__who { grid-template-columns: 1fr; } .hallticket > header b { display: none; } }
@media print {
  /* Two tickets to an A4 page: plain blocks, because browsers do not break a grid across pages reliably. */
  .halltickets { max-width: none; display: block; }
  .hallticket { border-radius: 0; height: 12.3cm; overflow: hidden; margin: 0 0 0.6cm; }
  .hallticket:nth-child(2n) { break-after: page; margin-bottom: 0; }
  .hallroom { border: 0; padding: 0; break-after: page; }
  .hallroom table { font-size: 0.9rem; }
}

/* Reel & Shorts maker: captions from speech, and posting */
.shorts__speech { display: grid; gap: 0.5rem; padding: 0.85rem 0.95rem; border: 1px solid var(--line); border-radius: 12px; background: #fafbff; }
.shorts__speech p { margin: 0; }
.shorts__caps summary { cursor: pointer; font-weight: 600; font-size: 0.88rem; color: var(--indigo); }
.shorts__caps[open] { display: grid; gap: 0.35rem; }
.shorts__caps label { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); align-items: center; gap: 0.4rem; margin: 0; }
.shorts__caps label span { color: var(--muted); font-variant-numeric: tabular-nums; font-weight: 500; font-size: 0.84rem; }
.shorts__caps input[type='text'] { height: 2.3rem; padding: 0 0.5rem; min-width: 0; margin: 0; }
.shorts__caps .btn { justify-self: start; margin-top: 0.3rem; }
.shorts__post { display: grid; gap: 0.5rem; padding: 0.8rem 0.9rem; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.shorts__post p { margin: 0; }
.howto { margin: 0; padding-left: 1.2rem; display: grid; gap: 0.35rem; font-size: 0.92rem; }

.feecert__note--warn { background: #fff4d6; border: 1px solid #f2dc9b; border-radius: 8px; padding: 0.5rem 0.7rem; color: #5b4300; }
@media (max-width: 560px) { .feecert .feecert__mode { display: none; } .feecert__table { font-size: 0.76rem; } .feecert__table td, .feecert__table th { padding: 0.3rem 0.3rem; } }
@media print { .feecert .feecert__mode { display: table-cell; } }
.hallticket tbody tr:last-child td, .feecert__table tbody tr:last-child td { border-bottom: 1px solid #999; }
.feecert__table tfoot td { border: 1px solid #b9bfd3; }

/* ---------- timetable maker ---------- */
h3 { color: var(--ink); font-size: 1rem; margin: 0 0 0.5rem; line-height: 1.25; }
.stepnav { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: 0.6rem; }
.stepnav a { display: flex; gap: 0.7rem; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 0.7rem 0.9rem; text-decoration: none; color: var(--ink); font-weight: 700; height: 100%; }
.stepnav a:hover { border-color: var(--indigo); }
.stepnav b { flex: none; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--navy); color: #fff; display: grid; place-items: center; font-size: 0.9rem; }
.stepnav span { display: grid; line-height: 1.3; }
.stepnav em { font-style: normal; font-weight: 500; font-size: 0.8rem; color: var(--muted); }
@media (min-width: 760px) { .stepnav { grid-template-columns: repeat(3, 1fr); } }
table.compact td, table.compact th { padding: 0.42rem 0.6rem; }
table.compact td strong { white-space: nowrap; }
tr.is-current td { background: #f3f5ff; }
.plan { min-width: 720px; }
.plan td { padding: 0.3rem 0.35rem; border-bottom: 0; vertical-align: middle; }
.plan th { padding: 0.3rem 0.45rem; }
.plan input[type='text'], .plan select, .plan input[type='number'] { padding: 0.45rem 0.55rem; font-size: 0.9rem; }
.plan input[type='number'] { width: 5.5rem; }
.plan td:nth-child(4) select { width: 4.5rem; }
.plantotal { font-size: 0.9rem; color: #14532d; background: #e4f5ea; padding: 0.2rem 0.7rem; border-radius: 999px; white-space: nowrap; }
.plantotal--over { color: #8f1220; background: #fde8ea; }
.plantotal--full { color: #fff; background: #1f8a4c; }
.plantotal:empty { display: none; }
.loadbar { height: 0.55rem; border-radius: 999px; background: #eceef6; overflow: hidden; margin-top: 0.35rem; }
.loadbar i { display: block; height: 100%; background: var(--indigo); border-radius: 999px; }
.loadbar--over i { background: var(--red); }
.more > summary { color: var(--indigo); }
.choice { display: grid; gap: 0.45rem; margin: 0.9rem 0; }
.btn--ok { background: #1f8a4c; }
.btn--ok:hover { background: #17703d; }
.confirmnote { font-size: 0.86rem; font-weight: 600; color: #8f1220; }
.tt--view td { height: 3rem; }
.tt__free { font-style: italic; color: #a3a8bd !important; }
.tt__closed { background: repeating-linear-gradient(135deg, #f6f7fb, #f6f7fb 6px, #eceef6 6px, #eceef6 12px); }
.tt__pane h3 { margin-top: 0.4rem; }
.tt__problem { color: #8f1220; font-weight: 600; }
[data-tt-result] { margin-top: 1.1rem; }
[data-tt-problems]:empty, [data-tt-tabs]:empty { display: none; }

/* Printed timetables: one sheet for each class or teacher, and the whole school on one sheet. */
.sheet { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.25rem; margin-bottom: 1.25rem; color: #111; }
.sheet__head { display: flex; align-items: center; gap: 0.9rem; border-bottom: 2px solid var(--navy); padding-bottom: 0.7rem; margin-bottom: 0.8rem; }
.sheet__head img { width: 92px; height: auto; flex: none; }
.sheet__head div { display: grid; font-size: 0.86rem; color: #444; }
.sheet__head strong { font-size: 1.2rem; color: var(--navy); line-height: 1.2; }
.sheet__who { margin-left: auto; text-align: right; }
.sheet__who strong { font-size: 1.35rem; }
.sheet .tt { border: 1px solid #b9bfd3; }
.sheet .tt th, .sheet .tt td { border: 1px solid #b9bfd3; }
.sheet .tt thead th { text-align: center; color: #111; background: #eef0f7; }
.sheet .tt td { text-align: center; }
.sheet .tt td strong { color: #111; }
.sheet .tt td span { color: #444; }
.tt--school { min-width: 900px; table-layout: auto; font-size: 0.8rem; }
.tt--school thead th span { display: block; font-weight: 500; font-size: 0.68rem; letter-spacing: 0; text-transform: none; }
.tt--school tbody th { width: auto; white-space: nowrap; }
.tt--school td { height: auto; padding: 0.25rem 0.2rem; }
.tt--school td strong { font-size: 0.8rem; }
.tt--school td span { font-size: 0.7rem; }
.tt--school .tt__gap { width: 1.2rem; padding: 0; background: #eef0f7; }
.tt__up { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 0.62rem !important; white-space: nowrap; margin: 0.3rem auto; }

/* ---------- print: the options panel and what every page does on paper ---------- */
.printhead { display: none; }
.printbox { border: 0; border-radius: 16px; padding: 1.4rem; width: min(34rem, calc(100vw - 2rem)); box-shadow: 0 24px 60px rgba(19, 26, 66, 0.3); color: var(--body); }
.printbox::backdrop { background: rgba(19, 26, 66, 0.45); }
.printbox form { display: grid; gap: 0.75rem; }
.printbox h2 { font-size: 1.25rem; margin: 0; }
.printbox__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.printbox__cols { max-height: 9.5rem; overflow-y: auto; }
.printbox p { margin: 0; }
.twoup { display: contents; }
.twoup__copy { display: none; }
@media print {
  .topbar, .shade, .navtoggle, .stepnav, .tabs, .btn, .linkbtn, .confirmnote, .printbox, details.danger, details.more, input[type='file'] { display: none !important; }
  a { color: inherit; text-decoration: none; }
  .tablewrap { overflow: visible; }
  table { min-width: 0 !important; }
  thead { display: table-header-group; }
  tr, .kpi, .sheet__head { break-inside: avoid; }
  h1, h2, h3 { break-after: avoid; }
  .card { border: 0; padding: 0; break-inside: auto; }
  .pagetitle h1 { font-size: 1.3rem; }
  .tablewrap table tbody tr:hover td { background: none; }
  td.actions, th.actions { display: none; }
  body.p-head .printhead { display: flex; align-items: center; gap: 0.8rem; border-bottom: 2px solid #1b2559; padding-bottom: 0.5rem; margin-bottom: 0.8rem; color: #111; }
  .printhead img { width: 78px; height: auto; }
  .printhead div { display: grid; font-size: 0.8rem; }
  .printhead strong { font-size: 1.15rem; color: #1b2559; }
  .sheet { border: 0; padding: 0; margin: 0; border-radius: 0; break-after: page; }
  .sheet:last-of-type { break-after: auto; }
  .sheet .tt thead th, .tt__break td, .tt--school .tt__gap, .tt tbody th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html, body, .shell, .main { background: #fff !important; }
  .sheet .tt { font-size: 0.82rem; }
  .sheet .tt td, .sheet .tt tbody th { height: auto; padding: 0.22rem 0.3rem; line-height: 1.25; }
  .sheet .tt td strong { font-size: 0.84rem; }
  .sheet .tt td span, .sheet .tt tbody th span { font-size: 0.72rem; }
  .sheet .tt__break td { padding: 0.1rem; font-size: 0.7rem; }
  .sheet__head { padding-bottom: 0.4rem; margin-bottom: 0.5rem; }
  .sheet__head img { width: 70px; }
  body.p-ink *, body.p-ink *::before, body.p-ink *::after { color: #000 !important; background: none !important; box-shadow: none !important; text-shadow: none !important; -webkit-print-color-adjust: economy !important; print-color-adjust: economy !important; }
  body.p-ink img { filter: grayscale(1); }
  body.p-two .twoup { display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; align-items: start; }
  body.p-two .twoup > * { max-width: none; min-width: 0; margin: 0; }
  body.p-two .twoup__copy { display: block; border-left: 1px dashed #999; padding-left: 10mm; }
}

/* ---------- question papers: the editor and the printed sheet ---------- */
.filterbox { width: min(18rem, 100%) !important; padding: 0.4rem 0.7rem !important; font-size: 0.88rem; }
.qpwork { display: grid; gap: 1.25rem; align-items: start; margin-bottom: 1.25rem; }
.qpwork > * { min-width: 0; }
.qpedit { margin: 0; }
.qpedit .stack { max-width: none; }
.qpedit textarea { font: 0.92rem/1.6 ui-monospace, 'SF Mono', Menlo, Consolas, 'Noto Sans Telugu', monospace; }
.qptools { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0.35rem 0 0.4rem; }
.qptools button { border: 1px solid var(--line); background: #f6f7fb; color: var(--ink); font: 600 0.8rem/1 inherit; font-family: inherit; padding: 0.42rem 0.6rem; border-radius: 7px; cursor: pointer; }
.qptools button:hover { background: #e9ecfa; border-color: #c5cbee; }
.qphelp { margin-top: 0.5rem; }
.qphelp .steps { margin-top: 0.6rem; grid-template-columns: minmax(0, 6.5rem) minmax(0, 1fr); font-size: 0.86rem; }
.qphelp code { font-size: 0.82rem; white-space: nowrap; }
.qplayout { border: 1px solid var(--line); border-radius: 10px; padding: 0.8rem 0.9rem 0.9rem; margin: 0; display: grid; gap: 0.8rem; min-width: 0; }
.qplayout > legend { font-size: 0.82rem; font-weight: 700; color: var(--muted); padding: 0 0.35rem; }
.qplayout__ticks { display: flex; flex-wrap: wrap; gap: 0.45rem 1.2rem; }
.qpsave { position: sticky; bottom: 0; background: #fff; padding: 0.7rem 0; border-top: 1px solid var(--line); margin-bottom: -0.5rem; z-index: 2; }
.qpview__note { margin: 0 0 0.4rem; }
.qpview__note span { color: #8f1220; font-weight: 600; }
@media (min-width: 1180px) {
  .qpwork { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); }
  .qpview { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
}

.qp { --qp: 1rem; background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 2rem 2.2rem; color: #111; font-size: var(--qp); line-height: 1.5; max-width: 820px; overflow-wrap: break-word; font-family: 'Plus Jakarta Sans', 'Noto Sans Telugu', system-ui, sans-serif; box-shadow: 0 2px 10px rgba(19, 26, 66, 0.06); }
.qp--text-small { --qp: 0.86rem; }
.qp--text-large { --qp: 1.14rem; }
.qp--text-xlarge { --qp: 1.34rem; }
.qp--space-wide { line-height: 1.85; }
.qp--space-tight { line-height: 1.32; }
.qp--border { outline: 1.5px solid #111; outline-offset: -0.9rem; padding: 2.4rem 2.6rem; }
.qp__head { display: flex; align-items: center; justify-content: center; gap: 1rem; text-align: left; border-bottom: 2px solid #111; padding-bottom: 0.6rem; }
.qp__head img { width: 5.6em; height: auto; flex: none; font-size: 1rem; }
.qp__head div { display: grid; }
.qp__head strong { font-size: 1.5em; line-height: 1.15; letter-spacing: 0.01em; }
.qp__head span { font-size: 0.82em; color: #333; }
.qp__head--compact { text-align: center; }
.qp__title { text-align: center; font-size: 1.18em; margin: 0.7em 0 0.45em; text-transform: uppercase; letter-spacing: 0.08em; color: #111; }
.qp__set { display: inline-block; border: 1.5px solid #111; border-radius: 4px; padding: 0 0.4em; margin-left: 0.4em; font-size: 0.8em; letter-spacing: 0.04em; vertical-align: middle; }
.qp__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.2em 1.4em; font-size: 0.95em; border-bottom: 1px solid #111; padding-bottom: 0.45em; }
.qp__fill { display: inline-block; width: 6.5em; border-bottom: 1px solid #333; height: 1em; vertical-align: baseline; }
.qp__who { display: flex; flex-wrap: wrap; gap: 0.4em 1.4em; margin-top: 0.75em; font-size: 0.95em; }
.qp__who span { display: flex; align-items: flex-end; gap: 0.4em; white-space: nowrap; }
.qp__who i { display: inline-block; width: 5em; border-bottom: 1px solid #333; height: 1.2em; }
.qp__who-name { flex: 1 1 14em; }
.qp__who-name i { flex: 1; width: auto; min-width: 6em; }
.qp__instr { border: 1px solid #555; border-radius: 4px; padding: 0.45em 0.8em; margin-top: 0.8em; font-size: 0.9em; }
.qp__instr ol { margin: 0.15em 0 0; padding-left: 1.4em; }
.qp__body { margin-top: 1em; }
.qp--two .qp__body { column-count: 2; column-gap: 2.2em; column-rule: 1px solid #999; }
.qp__section { display: flex; justify-content: space-between; align-items: baseline; gap: 1em; font-size: 1.02em; font-weight: 700; color: #111; margin: 1.1em 0 0.5em; padding: 0.2em 0.5em; background: #eef0f4; border-left: 3px solid #111; break-after: avoid; break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.qp__section:first-child { margin-top: 0; }
.qp__section em { font-style: normal; font-weight: 600; font-size: 0.9em; white-space: nowrap; }
.qp__q { display: grid; grid-template-columns: 2em minmax(0, 1fr) auto; gap: 0 0.3em; margin: 0 0 0.7em; break-inside: avoid; }
.qp__no { font-weight: 700; text-align: right; padding-right: 0.25em; }
.qp__marks { font-weight: 600; font-size: 0.9em; white-space: nowrap; padding-left: 0.6em; }
.qp__more { display: block; }
.qp__opts { list-style: none; margin: 0.3em 0 0; padding: 0; display: grid; gap: 0.15em 1.2em; }
.qp__opts--2 { grid-template-columns: 1fr 1fr; }
.qp__opts--4 { grid-template-columns: repeat(auto-fit, minmax(7.5em, 1fr)); }
.qp__opts li { display: flex; gap: 0.4em; }
.qp__opts b { font-weight: 600; flex: none; }
.qp__opts span { flex: 1; }
.qp__opts em { font-style: normal; font-weight: 600; font-size: 0.9em; }
.qp--two .qp__opts--4 { grid-template-columns: 1fr 1fr; }
.qp__match { width: auto; min-width: 70%; margin: 0.35em 0 0; border-collapse: collapse; font-size: 1em; }
.qp__match td { border: 0; padding: 0.15em 2.5em 0.15em 0; background: none; }
.qp__blank { display: inline-block; border-bottom: 1px solid #111; height: 1em; vertical-align: baseline; margin: 0 0.15em; }
.qp__lines { margin-top: 0.2em; }
.qp__lines i { display: block; border-bottom: 1px solid #777; height: 1.9em; }
.qp__box { border: 1px solid #333; border-radius: 3px; margin: 0.45em 0 0.2em; }
.qp__para { margin: 0 0 0.7em; }
.qp__or { text-align: center; font-weight: 700; margin: 0 0 0.7em; }
.qp__rule { border: 0; border-top: 1px solid #111; margin: 0.8em 0; }
.qp__page { border-top: 1px dashed #9aa0b8; margin: 1.2em 0; text-align: center; height: 0; column-span: all; }
.qp__page span { position: relative; top: -0.8em; background: #fff; padding: 0 0.6em; font-size: 0.7rem; color: #71768f; text-transform: uppercase; letter-spacing: 0.1em; }
.qp__end { text-align: center; font-size: 0.85em; margin: 1.4em 0 0; letter-spacing: 0.1em; }
.qp__empty { color: var(--muted); font-style: italic; }
@media (max-width: 640px) { .qp { padding: 1.1rem 1rem; } .qp__head img { width: 4em; } }
@media print {
  .qpwork { display: block; margin: 0; }
  .qpview { position: static; max-height: none; overflow: visible; }
  .qp { border: 0; border-radius: 0; padding: 0; max-width: none; box-shadow: none; font-size: calc(var(--qp) * 0.92); }
  .qp--border { outline-offset: 0; padding: 0.9rem 1.1rem; }
  .qp__page { break-after: page; border: 0; margin: 0; }
  .qp__page span { display: none; }
  body.p-two .qp { font-size: calc(var(--qp) * 0.74); }
  body.p-two .qp__head img { width: 4em; }
}

/* ---------- fee reports ---------- */
.kpi--link:hover { border-color: var(--indigo); }
.reportlist { display: grid; gap: 0.6rem; }
.reportlist a { display: grid; align-content: start; gap: 0.15rem; padding: 0.8rem 0.95rem; border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--body); background: #fff; }
.reportlist a:hover { border-color: var(--indigo); background: #fafbff; }
.reportlist strong { color: var(--ink); font-size: 0.98rem; }
.reportlist span { font-size: 0.86rem; color: var(--muted); }
@media (min-width: 700px) { .reportlist { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .reportlist { grid-template-columns: repeat(3, 1fr); } }
.reportbar { display: flex; flex-wrap: wrap; align-items: end; gap: 0.75rem; padding: 0.9rem 1.1rem; }
.reportbar label { flex: 1 1 8.5rem; max-width: 14rem; min-width: 0; }
.reportbar input, .reportbar select { padding: 0.5rem 0.65rem; }
.reportbar__quick { display: flex; flex-wrap: wrap; gap: 0.35rem; flex-basis: 100%; }
.reportbar__quick a { padding: 0.25rem 0.7rem; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; font-size: 0.82rem; font-weight: 600; color: var(--ink); background: #fff; }
.reportbar__quick a[aria-current='true'] { background: var(--navy); border-color: var(--navy); color: #fff; }
.report { font-size: 0.88rem; }
.report td, .report th { padding: 0.5rem 0.6rem; }
.report tfoot td { font-weight: 700; color: var(--ink); border-top: 2px solid var(--ink); border-bottom: 0; background: #f6f7fb; }
.report tr.is-late td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.report td.num { font-variant-numeric: tabular-nums; }
.printonly-block { display: none; }
@media print {
  .printonly-block { display: block; margin: 0.1rem 0 0; font-size: 0.9rem; color: #333; }
  .report { font-size: 0.78rem; }
  .report td, .report th { padding: 0.22rem 0.35rem; }
  .report th { white-space: normal; letter-spacing: 0.02em; }
  .report tfoot { display: table-row-group; }
  .report tfoot td, .kpi { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .report tr.is-late td:first-child { box-shadow: none; }
  .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.4rem; margin-bottom: 0.6rem; }
  .kpi { padding: 0.4rem 0.6rem; border-radius: 6px; box-shadow: none; }
  .kpi strong { font-size: 1.05rem; }
}

/* ---------- from the design review ---------- */
.marks td:first-child, .marks th:first-child { position: sticky; left: 0; background: #fff; z-index: 1; box-shadow: 1px 0 0 var(--line); }
input[type='file']::file-selector-button { font: 600 0.86rem/1 inherit; font-family: inherit; padding: 0.55rem 0.9rem; margin-right: 0.7rem; border-radius: 8px; border: 1px solid var(--line); background: #fff; color: var(--navy); cursor: pointer; }
input[type='file']::file-selector-button:hover { background: #f1f3fa; }
.enquiry__said { margin: 0.2rem 0 0.4rem; font-size: 0.92rem; }
.enquiry__update > summary { font-size: 0.88rem; }
.enquiry__update[open] > summary { margin-bottom: 0.5rem; }
.tt__print { display: none; }
.periodtable td { vertical-align: middle; }
@media (max-width: 700px) {
  .btn--small { min-height: 40px; padding-inline: 0.9rem; }
  .danger summary, details.more > summary, .tabs a, .chip, .reportbar__quick a { min-height: 40px; display: inline-flex; align-items: center; }
  .periodform { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; align-items: center; font-size: 0.86rem; }
  .periodform input[type='text'] { grid-column: 1 / -1; width: 100% !important; }
  .periodform input[type='time'] { width: 100% !important; }
  .periodtable td { display: block; padding: 0.5rem 0; border: 0; }
  .periodtable tr { display: block; padding: 0.6rem 0; border-bottom: 1px solid var(--line); }
  .periodtable thead { display: none; }
  .periodtable td.actions { text-align: left; }
  /* Lists become one card for each row: the name on top, the rest as "label: value" in two columns, the buttons underneath. */
  table.stackable thead { position: absolute; left: -9999px; }
  table.stackable, table.stackable tbody, table.stackable tfoot { display: block; }
  table.stackable tfoot tr { border-bottom: 0; background: #f6f7fb; padding: 0.7rem 0.6rem; border-radius: 10px; margin-top: 0.5rem; }
  .report.stackable tfoot td { border: 0; background: none; }
  table.stackable tr { display: grid; grid-template-columns: 1fr 1fr; gap: 0.2rem 0.9rem; padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
  table.stackable tr[hidden] { display: none; }
  table.stackable td { display: block; border: 0; padding: 0; min-width: 0; text-align: left; white-space: normal; font-size: 0.88rem; overflow-wrap: anywhere; }
  table.stackable td.is-title { grid-column: 1 / -1; order: -1; font-size: 1.02rem; }
  table.stackable td[data-label]:not(.is-title):not(.actions)::before { content: attr(data-label) ': '; font-size: 0.78rem; font-weight: 600; color: var(--muted); }
  table.stackable td:empty { display: none; }
  table.stackable td.is-wide { grid-column: 1 / -1; }
  table.stackable td.actions { grid-column: 1 / -1; order: 9; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-top: 0.3rem; }
  table.stackable td.actions > * { margin-left: 0; }
  table.stackable td.actions > a:not(.btn) { display: inline-flex; align-items: center; min-height: 40px; padding: 0 0.9rem; border: 1px solid var(--line); border-radius: 8px; text-decoration: none; font-weight: 600; }
  .tablewrap table.stackable tbody tr:hover td { background: none; }
}
@media print {
  form[method='get'], .pagetitle p.muted, .pagetitle > p:first-child, .pagetitle p:has(> a:only-child), .reportbar, .qpview__note { display: none !important; }
  .tt td input, .tt td select { display: none !important; }
  .tt__print { display: block; }
  .tt th, .tt td { padding: 0.22rem 0.35rem; line-height: 1.25; }
  .tt tbody th span { font-size: 0.7rem; }
  .tt__break td { padding: 0.1rem; font-size: 0.68rem; }
  .card h2 { margin-bottom: 0.4rem; }
  .pagetitle { margin-bottom: 0.5rem; }
  .tt__print strong { display: block; font-size: 0.86rem; }
  .tt__print span { display: block; font-size: 0.74rem; color: #333; }
  .tt { table-layout: auto; }
  .pill { border: 1px solid #999; }
}

/* ---------- registers: a month as a grid ---------- */
.reg { font-size: 0.78rem; border: 1px solid #b9bfd3; min-width: 900px; }
.reg th, .reg td { border: 1px solid #b9bfd3; padding: 0.22rem 0.15rem; text-align: center; white-space: nowrap; color: #111; text-transform: none; letter-spacing: 0; font-size: inherit; }
.reg thead th { background: #eef0f7; font-weight: 700; }
.reg .reg__name { text-align: left; padding-left: 0.4rem; padding-right: 0.4rem; font-weight: 600; min-width: 9rem; }
.reg .reg__name span { font-weight: 400; color: #555; font-size: 0.72rem; }
.reg .reg__n { width: 2.2rem; }
.reg__off { background: #f1f2f6; color: #999 !important; }
.reg__a { color: #b3192a !important; font-weight: 700; background: #fff1f2; }
.reg__l { color: #7a5600 !important; font-weight: 700; }
.reg tfoot td { font-weight: 700; background: #f6f7fb; }
.reg__sign { display: flex; justify-content: space-between; margin: 2.4rem 1rem 0; font-size: 0.86rem; }
.reg__sign span { border-top: 1px solid #777; padding-top: 0.2rem; min-width: 10rem; text-align: center; }
@media print {
  .reg { font-size: 0.66rem; }
  .reg th, .reg td { padding: 0.1rem 0.08rem; }
  .reg .reg__name { min-width: 0; }
  .reg thead th, .reg__off, .reg__a, .reg tfoot td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sheet--register { break-after: auto; }
}

/* ---------- exams: a class of report cards, the year on one card, the duty chart ---------- */
.cardstack .reportcard { margin-bottom: 1.25rem; }
.reportcard--year table { font-size: 0.9rem; }
.reportcard--year thead th { text-align: center; text-transform: none; letter-spacing: 0; font-size: 0.8rem; color: #111; white-space: normal; }
.reportcard--year thead th span { font-weight: 400; color: #555; }
.reportcard--year td, .reportcard--year tfoot th { text-align: center; }
.reportcard--year td:first-child, .reportcard--year th:first-child { text-align: left; }
.reportcard__who--foot { margin-top: 0.9rem; }
.reportcard__remark--blank { min-height: 3.2rem; border-bottom: 1px solid #999; }
.duty { min-width: 0; table-layout: auto; }
.duty tbody th { width: 13rem; }
.duty thead th span { display: block; font-weight: 500; font-size: 0.72rem; text-transform: none; letter-spacing: 0; }
.duty__papers { font-size: 0.72rem !important; white-space: normal; }
.duty__clash { background: #fde8ea; }
.duty td select { font-size: 0.86rem; margin: 0; }
@media print {
  .cardstack .reportcard { break-after: page; margin: 0; }
  .cardstack .reportcard:last-child { break-after: auto; }
  .duty th, .duty td { border: 1px solid #b9bfd3; height: auto; padding: 0.3rem 0.4rem; }
  .duty tbody th { width: 30%; }
  .chip { border: 1px solid #b9bfd3; background: none; }
}

/* ---------- fee demand slips: four to a sheet ---------- */
.slips { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); margin-bottom: 1.25rem; }
.slipcard { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.1rem; color: #111; font-size: 0.88rem; break-inside: avoid; }
.slipcard > header { display: flex; gap: 0.7rem; align-items: center; border-bottom: 1.5px solid var(--navy); padding-bottom: 0.5rem; }
.slipcard > header img { width: 64px; height: auto; }
.slipcard > header div { display: grid; font-size: 0.78rem; color: #444; }
.slipcard > header strong { font-size: 1rem; color: var(--navy); }
.slipcard__who { margin: 0.6rem 0 0.4rem; }
.slipcard__who span { color: #444; font-size: 0.82rem; }
.slipcard table { font-size: 0.86rem; }
.slipcard td, .slipcard th { padding: 0.25rem 0; border-bottom: 1px dotted #c9cde0; text-transform: none; letter-spacing: 0; font-size: inherit; color: #111; }
.slipcard td span { color: #666; font-size: 0.76rem; }
.slipcard tfoot th { border-top: 1.5px solid #111; border-bottom: 0; font-weight: 700; }
.slipcard__note { font-size: 0.78rem; color: #333; margin: 0.6rem 0 0; }
.slipcard__act { display: flex; gap: 0.8rem; align-items: center; margin: 0.6rem 0 0; }
tr.is-void td { text-decoration: line-through; color: var(--muted); }
@media print {
  /* Four to an A4 sheet: two across, two down. Plain blocks, because a grid does not break across pages reliably. */
  .slips { display: block; margin: 0; }
  .slipcard { display: inline-block; vertical-align: top; width: calc(50% - 6mm); height: 127mm; margin: 0 1.5mm 3mm; border: 1px dashed #777; border-radius: 0; overflow: hidden; }
}

/* ---------- question bank, observations, labs, certificates ---------- */
.banklist { list-style: none; margin: 0; padding: 0; display: grid; }
.banklist li { padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.banklist__q { display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 500; color: var(--ink); }
.banklist__q input { width: 1.1rem; height: 1.1rem; margin-top: 0.2rem; flex: none; accent-color: var(--navy); }
.banklist__q span { white-space: pre-wrap; overflow-wrap: anywhere; }
.banklist__meta { margin: 0.3rem 0 0 1.7rem; font-size: 0.84rem; color: var(--muted); }
.obsgrid { display: grid; gap: 0.7rem; }
@media (min-width: 720px) { .obsgrid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1150px) { .obsgrid { grid-template-columns: repeat(4, 1fr); } }
.obs__marks { list-style: none; margin: 0 0 0.8rem; padding: 0; display: grid; gap: 0.3rem 1.5rem; }
@media (min-width: 720px) { .obs__marks { grid-template-columns: 1fr 1fr; } }
.obs__marks li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; }
.obs__marks span { flex: 1; }
.obs__marks em { font-style: normal; color: var(--muted); font-size: 0.82rem; width: 5.5rem; }
.obs__dot { width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font-size: 0.78rem; color: #fff; background: #1f8a4c; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.obs__dot--1 { background: var(--red); }
.obs__dot--2 { background: #c98f00; }
.obs__dot--3 { background: #3b7f5c; }
.tt__date { display: block; font-weight: 500; font-size: 0.72rem; letter-spacing: 0; text-transform: none; }
.tt--view td form { margin-top: 0.15rem; }
.rollchange { color: #8f1220; font-weight: 700; }
.certstack { display: grid; gap: 1.25rem; }
.certsheet { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 1.1rem; color: #111; max-width: 980px; aspect-ratio: 297 / 205; }
.certsheet__in { height: 100%; border: 3px double #1b2559; outline: 1.5px solid #f4b400; outline-offset: -0.55rem; padding: 1.6rem 2.2rem 1.2rem; display: flex; flex-direction: column; align-items: center; text-align: center; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.certsheet img { width: 8.5rem; height: auto; }
.certsheet__school { font-size: 1.7rem; font-weight: 700; color: #1b2559; margin: 0.5rem 0 0; line-height: 1.15; }
.certsheet__addr { font-size: 0.86rem; color: #444; margin: 0.1rem 0 0; }
.certsheet h2 { font-size: 1.9rem; letter-spacing: 0.12em; text-transform: uppercase; color: #8a6200; margin: 1.1rem 0 0.4rem; }
.certsheet__lead { margin: 0; color: #444; }
.certsheet__name { font-size: 2.3rem; font-weight: 700; color: #1b2559; margin: 0.25rem 0 0; border-bottom: 1.5px solid #1b2559; padding: 0 2rem 0.15rem; line-height: 1.2; }
.certsheet__class { margin: 0.4rem 0 0; font-size: 1.05rem; }
.certsheet__what { margin: 0.5rem 0 0; font-size: 1.15rem; max-width: 46rem; }
.certsheet__foot { margin-top: auto; width: 100%; display: flex; justify-content: space-between; align-items: flex-end; font-size: 0.9rem; padding-top: 1.5rem; }
.certsheet__foot span { border-top: 1px solid #555; padding-top: 0.25rem; min-width: 11rem; }
.certsheet__foot em { font-style: normal; color: #444; }
@media (max-width: 700px) { .certsheet { aspect-ratio: auto; } .certsheet__name { font-size: 1.5rem; padding: 0 0.5rem 0.15rem; } .certsheet h2 { font-size: 1.2rem; } .certsheet__school { font-size: 1.2rem; } .certsheet__in { padding: 1.1rem 0.9rem; } .certsheet__foot span { min-width: 0; } }
@media print {
  .certstack { display: block; }
  .certsheet { border: 0; border-radius: 0; padding: 0; max-width: none; aspect-ratio: auto; height: 178mm; break-after: page; break-inside: avoid; }
  .certsheet:last-child { break-after: auto; }
  .banklist__meta button, details.card > summary { display: none; }
}

/* ---------- holiday calendar, events, conduct, growth ---------- */
.holimonths { display: grid; gap: 1.2rem 1.6rem; }
@media (min-width: 720px) { .holimonths { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1150px) { .holimonths { grid-template-columns: repeat(3, 1fr); } }
.holimonths ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.holimonths li { display: flex; align-items: center; gap: 0.7rem; }
.holimonths li b { flex: none; width: 2.2rem; height: 2.2rem; border-radius: 8px; background: #eef0fb; color: var(--navy); display: grid; place-items: center; font-size: 0.95rem; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.holimonths li span { flex: 1; display: grid; line-height: 1.3; color: var(--ink); font-weight: 600; font-size: 0.92rem; }
.holimonths li em { font-style: normal; font-weight: 400; color: var(--muted); font-size: 0.8rem; }
.holimonths li.is-past { opacity: 0.55; }
.evtask { display: grid; grid-template-columns: 2rem minmax(0, 2.2fr) minmax(0, 1fr) 9.5rem 6rem auto; gap: 0.4rem; align-items: center; }
.evtask input { padding: 0.4rem 0.5rem; font-size: 0.88rem; }
.evtask__tick { width: 1.7rem; height: 1.7rem; border-radius: 6px; border: 1.5px solid #9aa0b8; background: #fff; cursor: pointer; font-weight: 700; color: #1f8a4c; line-height: 1; }
.evtasks tr.is-done input[name='task'] { text-decoration: line-through; color: var(--muted); }
.evtasks tr.is-late td { box-shadow: inset 3px 0 0 var(--red); }
.evtasks td { padding: 0.35rem 0.4rem; }
.evtask--new { margin-top: 0.8rem; padding: 0 0.4rem; }
@media (max-width: 760px) { .evtask { grid-template-columns: 2rem 1fr 1fr; } .evtask input[name='task'] { grid-column: 2 / -1; } .evtask > .row { grid-column: 2 / -1; } }
.chip--warn { background: #fde8ea; color: #8f1220; }
.growth input { width: 6rem; }
.growchart { width: 100%; height: auto; max-height: 220px; }
@media print { .evtask input { border: 0; padding: 0; background: none; } .evtask__tick { border-color: #555; } }

/* ---------- staff cards and letters ---------- */
.idcard__photo { width: 74px; height: 92px; border: 1px dashed #9aa0b8; border-radius: 6px; display: grid; place-items: center; font-size: 0.7rem; color: var(--muted); }
.letter__foot--two { grid-template-columns: 1fr 0.6fr 1fr; }
.letter__foot--two .letter__sign:empty { border: 0; }

.reportcard__skills { margin-top: 0.9rem; font-size: 0.92rem; }
.reportcard__skills td:last-child, .reportcard__skills th:last-child { width: 45%; }

/* Telugu on the staff pages: a little more room for the taller letters. */
body.is-te { font-family: 'Plus Jakarta Sans', 'Noto Sans Telugu', system-ui, sans-serif; }
body.is-te .side nav a, body.is-te .btn, body.is-te th { line-height: 1.45; }
body.is-te th { letter-spacing: 0; text-transform: none; font-size: 0.8rem; }

/* Staff workspace: predictable focus, readable records and a usable phone drawer. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; left: 1rem; top: -8rem; background: #fff; color: var(--navy); padding: 0.8rem 1rem; border: 2px solid var(--navy); border-radius: 8px; font-weight: 700; }
.skip-link:focus { top: 0.5rem; }
:focus-visible { outline: 3px solid #5362c8; outline-offset: 3px; }
.side :focus-visible, .topbar :focus-visible { outline-color: var(--gold); }
.main { width: 100%; max-width: 1520px; margin-inline: auto; min-width: 0; }
.main:focus { outline: none; }
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.55rem; margin-bottom: 1rem; font-size: 0.8rem; color: var(--muted); }
.breadcrumbs a { text-decoration: none; color: var(--indigo); }
.breadcrumbs a:hover { text-decoration: underline; }
.breadcrumbs [aria-current] { color: var(--ink); font-weight: 600; }
.topbar__menu, .topbar__search { border: 0; background: transparent; flex: none; width: 44px; height: 44px; padding: 0; }
.side__close { align-self: flex-end; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; margin-bottom: -0.5rem; font-size: 1.75rem; line-height: 1; color: #fff; background: rgba(255,255,255,.1); border: 0; border-radius: 10px; cursor: pointer; }
.shade { border: 0; margin: 0; width: 100%; height: 100%; padding: 0; }
.side__results a:focus { background: #eef0fb; outline-offset: -3px; }
.navtoggle { display: none; }
body.nav-open { overflow: hidden; }
.side__brand { line-height: 1.45; }
.side nav a, .navgroup summary { min-height: 42px; }
.filterbar { align-items: end; }
.filterbar label { display: grid; gap: 0.3rem; flex: 1 1 10rem; min-width: 0; }
.filterbar label input, .filterbar label select { width: 100%; }
.filterbar .btn { flex-shrink: 0; }
input, select, textarea { max-width: 100%; }
input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; background: #eef0f5; color: #626a80; }
.btn:disabled { opacity: 0.6; cursor: wait; }
.card h2 { line-height: 1.4; }
.card > :last-child { margin-bottom: 0; }
.facts { grid-template-columns: minmax(7rem, 9rem) minmax(0, 1fr); }
.facts dd, .card p, .enquiry__said { overflow-wrap: anywhere; }
.tablewrap.can-scroll { border-right: 2px solid #b8bfd6; }
.tablewrap.can-scroll::after { content: 'Scroll sideways to see all columns →'; display: block; position: sticky; left: 0; padding: 0.55rem 0.2rem 0.1rem; color: var(--muted); font-size: 0.78rem; }
.record-actions, .section-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }
.section-nav { margin: 1rem 0; padding: 0.75rem 0; border-block: 1px solid var(--line); }
.section-nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0.4rem 0.8rem; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-decoration: none; font-size: 0.86rem; font-weight: 600; }
.empty-state { text-align: center; padding: 2rem 1.1rem; max-width: 42rem; margin-inline: auto; }
.empty-state h2, .empty-state h3 { margin: 0 0 0.5rem; }
.empty-state p { max-width: 34rem; margin: 0 auto 1rem; color: var(--muted); }
.empty-state .row { justify-content: center; }
.private-link input { width: 100%; min-width: 0; }
.timeline { list-style: none; padding: 0 0 0 1rem; margin: 0; border-left: 2px solid var(--line); }
.timeline li { position: relative; padding: 0 0 1rem 0.6rem; }
.timeline li::before { content: ''; position: absolute; top: 0.4rem; left: -1.35rem; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--indigo); }
.timeline p { margin: 0.25rem 0; }
.confirm-dialog { width: min(30rem, calc(100% - 2rem)); border: 1px solid var(--line); border-radius: 16px; padding: 1.5rem; color: var(--ink); box-shadow: 0 24px 80px #131a4240; }
.confirm-dialog::backdrop { background: #11193499; }
.confirm-dialog h2 { margin-top: 0; font-size: 1.25rem; }
.confirm-dialog p { overflow-wrap: anywhere; }
.confirm-dialog .row { justify-content: flex-end; margin-top: 1.4rem; }
@media (max-width: 999px) {
  .topbar__brand span { display: block; font-size: 0.72rem; font-weight: 500; opacity: 0.75; }
  .breadcrumbs { margin-bottom: 0.8rem; }
}
@media (min-width: 1000px) { .side__close { display: none; } }
@media (max-width: 700px) {
  .main { padding-inline: 0.85rem; }
  .pagetitle h1 { overflow-wrap: anywhere; }
  .pagetitle.row { align-items: flex-start; }
  .card { padding: 1rem; border-radius: 12px; }
  .filterbar { gap: 0.7rem; }
  .filterbar label { flex-basis: 100%; }
  .filterbar > .btn { flex: 1; }
  input:not([type='checkbox']):not([type='radio']), select, textarea { font-size: 16px; }
  .btn { min-height: 44px; }
  .private-link .row > * { min-width: 0; }
  .facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 0.6rem; }
  .section-nav { gap: 0.4rem; }
  .section-nav a { padding-inline: 0.6rem; }
  .empty-state { padding: 1.6rem 0.4rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } }
@media print { .breadcrumbs, .side__close, .skip-link, .confirm-dialog, .tablewrap.can-scroll::after { display: none !important; } .tablewrap.can-scroll { border-right: 0; } }
.actions--forms { white-space: normal; text-align: left; }
.actions--forms > .record-actions { display: grid; gap: 0.7rem; min-width: 0; margin-left: 0; }
.actions--forms .stack { width: 100%; min-width: 0; }
@media (min-width: 1200px) { .todo--overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.todo--overview li { align-content: start; gap: 0.5rem; }
.todo--overview li > span { flex: 1 1 14rem; }
.todo--overview li > a { font-size: 0.86rem; font-weight: 600; padding: 0.25rem 0; }