:root {
    --bg: #f5efe4;
    --paper: #fffaf3;
    --ink: #1c1917;
    --muted: #6b5d52;
    --accent: #cf5f3f;
    --accent-soft: #f4c8a4;
    --line: #dfcfbf;
    --card: #fffdf8;
    --shadow: 0 20px 45px rgba(76, 49, 27, 0.12);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    background:
        radial-gradient(circle at top left, rgba(207, 95, 63, 0.18), transparent 28%),
        radial-gradient(circle at bottom right, rgba(244, 200, 164, 0.45), transparent 32%),
        var(--bg);
    color: var(--ink);
}

code {
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(28, 25, 23, 0.08);
}

a {
    color: inherit;
    text-decoration: none;
}

.shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 280px 1fr;
}

.sidebar {
    padding: 28px;
    border-right: 1px solid rgba(223, 207, 191, 0.85);
    background: rgba(255, 250, 243, 0.72);
    backdrop-filter: blur(14px);
    position: sticky;
    top: 0;
    height: 100vh;
}

.brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 40px;
}

.brand-mark {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--accent), #f0944d);
    color: white;
    font-weight: 700;
    box-shadow: var(--shadow);
}

.brand strong,
.hero h1,
.panel h2,
.panel h1,
.roadmap-card h3,
.school-card strong,
.stat-card strong {
    font-family: Georgia, "Times New Roman", serif;
}

.brand small,
.eyebrow,
.nav-link,
.stat-card span,
.hero-card span,
.phase-summary span {
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.78rem;
}

.nav {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sidebar-user {
    margin-top: 24px;
    padding: 16px;
    border-radius: 18px;
    background: rgba(207, 95, 63, 0.08);
}

.sidebar-user small {
    display: block;
    margin-top: 6px;
    color: var(--muted);
}

.nav-link {
    padding: 12px 14px;
    border-radius: 14px;
    color: var(--muted);
    transition: 180ms ease;
}

.nav-link:hover,
.nav-link.is-active {
    background: rgba(207, 95, 63, 0.1);
    color: var(--ink);
}

.nav-logout {
    margin: 0;
}

.nav-logout .nav-link {
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.inline-form {
    display: inline;
}

.inline-form button {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
    cursor: pointer;
    font: inherit;
}

.content {
    padding: 28px;
}

.module-menu {
    position: relative;
    margin-bottom: 22px;
}

:root { --user-ui-scale: 1.1; }
body { overflow-x: hidden; }
.content-scale-target {
    width: 100%;
}
.content-scale-target .overview-heading h1 { font-size: calc(1.35rem * var(--user-ui-scale)); }
.content-scale-target .overview-heading p { font-size: calc(.73rem * var(--user-ui-scale)); }
.content-scale-target .overview-card h2 { font-size: calc(.86rem * var(--user-ui-scale)); }
.content-scale-target .overview-metric small { font-size: calc(.74rem * var(--user-ui-scale)); }
.content-scale-target .overview-metric strong { font-size: calc(1.34rem * var(--user-ui-scale)); }
.content-scale-target .overview-metric em { font-size: calc(.63rem * var(--user-ui-scale)); }
.content-scale-target .overview-metric a { font-size: calc(.67rem * var(--user-ui-scale)); }
.content-scale-target .overview-action small { font-size: calc(.62rem * var(--user-ui-scale)); }
.content-scale-target .overview-list > a { font-size: calc(.67rem * var(--user-ui-scale)); }
.content-scale-target .overview-list--schedule strong { font-size: calc(.65rem * var(--user-ui-scale)); }
.content-scale-target .overview-list--schedule span { font-size: calc(.66rem * var(--user-ui-scale)); }
.content-scale-target .overview-list--meal strong { font-size: calc(.7rem * var(--user-ui-scale)); }
.content-scale-target .overview-list--announcements strong { font-size: calc(.68rem * var(--user-ui-scale)); }
.content-scale-target .overview-list--announcements small { font-size: calc(.59rem * var(--user-ui-scale)); }
.content-scale-target .overview-footer-link { font-size: calc(.65rem * var(--user-ui-scale)); }
.content-scale-target .overview-donut strong { font-size: calc(.72rem * var(--user-ui-scale)); }
.content-scale-target .overview-donut small { font-size: calc(.58rem * var(--user-ui-scale)); }
.content-scale-target .overview-finance-legend span, .content-scale-target .overview-finance-legend b { font-size: calc(.62rem * var(--user-ui-scale)); }
.content-scale-target .overview-heading { gap: calc(10px * var(--user-ui-scale)); margin: calc(8px * var(--user-ui-scale)) 0 calc(16px * var(--user-ui-scale)); }
.content-scale-target .overview-heading__icon { width: calc(26px * var(--user-ui-scale)); height: calc(26px * var(--user-ui-scale)); border-radius: calc(9px * var(--user-ui-scale)); }
.content-scale-target .overview-metrics, .content-scale-target .overview-grid { gap: calc(12px * var(--user-ui-scale)); margin-bottom: calc(12px * var(--user-ui-scale)); }
.content-scale-target .overview-metric, .content-scale-target .overview-card { border-radius: calc(12px * var(--user-ui-scale)); }
.content-scale-target .overview-metric { grid-template-columns: calc(38px * var(--user-ui-scale)) minmax(0, 1fr); gap: calc(10px * var(--user-ui-scale)); padding: calc(15px * var(--user-ui-scale)); min-height: calc(132px * var(--user-ui-scale)); }
.content-scale-target .overview-card { padding: calc(15px * var(--user-ui-scale)); }
.content-scale-target .overview-icon { width: calc(36px * var(--user-ui-scale)); height: calc(36px * var(--user-ui-scale)); border-radius: 50%; }
.content-scale-target .overview-action-grid { gap: calc(8px * var(--user-ui-scale)); }
.content-scale-target .overview-action { min-height: calc(72px * var(--user-ui-scale)); padding: calc(8px * var(--user-ui-scale)) calc(4px * var(--user-ui-scale)); border-radius: calc(9px * var(--user-ui-scale)); }
.content-scale-target .overview-action span { width: calc(28px * var(--user-ui-scale)); height: calc(28px * var(--user-ui-scale)); border-radius: calc(8px * var(--user-ui-scale)); }
.content-scale-target .overview-donut { width: calc(105px * var(--user-ui-scale)); height: calc(105px * var(--user-ui-scale)); }
.content-scale-target .overview-donut:before { inset: calc(12px * var(--user-ui-scale)); }
.display-scale-control {
    display: grid;
    grid-template-columns: 28px max-content minmax(150px, 260px) max-content max-content;
    align-items: center;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 10px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--card);
    box-shadow: var(--shadow);
    color: var(--navy);
}
.display-scale-control__icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 800;
}
.display-scale-control label { font-size: .78rem; font-weight: 700; white-space: nowrap; }
.display-scale-control input { accent-color: var(--accent); }
.display-scale-control output { min-width: 36px; color: var(--navy); font-size: .76rem; font-weight: 800; }
.display-scale-control button { border: 0; background: transparent; color: var(--accent); cursor: pointer; font: inherit; font-size: .72rem; font-weight: 800; }
.display-scale-control--sidebar { grid-template-columns: 28px 1fr max-content; width: 100%; margin: 12px 0 0; padding: 10px; }
.display-scale-control--sidebar input { grid-column: 2 / -1; width: 100%; }
.display-scale-control--sidebar output { grid-column: 2; }
.display-scale-control--sidebar button { grid-column: 3; grid-row: 2; }
.display-scale-control--header { display: none; }

.module-menu-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255, 253, 248, .92);
    color: var(--ink);
    cursor: pointer;
    font: inherit;
    text-align: left;
    box-shadow: 0 8px 20px rgba(76, 49, 27, .08);
}
.module-menu-toggle::-webkit-details-marker { display: none; }
.module-menu[open] .module-menu-toggle b { font-size: 0; }
.module-menu[open] .module-menu-toggle b::after { content: "Listeyi kapat"; font-size: 12px; }
.module-menu-toggle strong { display: block; font-family: Georgia, "Times New Roman", serif; font-size: 18px; }
.module-menu-toggle small { display: block; color: var(--muted); margin-top: 2px; }
.module-menu-toggle b { margin-left: 10px; padding-left: 12px; border-left: 1px solid var(--line); color: var(--accent); font-size: 12px; }
.module-menu-icon { color: var(--accent); font-size: 20px; line-height: 1; }

.module-menu-panel {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 40;
    width: min(920px, calc(100vw - 350px));
    display: grid;
    grid-template-columns: repeat(3, minmax(210px, 1fr));
    gap: 18px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: rgba(255, 253, 248, .98);
    box-shadow: 0 12px 28px rgba(76, 49, 27, .08);
}

.module-menu-group { display: grid; align-content: start; gap: 5px; }
.module-menu-group h2 { margin: 0 0 6px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.module-menu-group a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border-radius: 10px; color: var(--muted); font-size: 14px; }
.module-menu-group a:hover { background: rgba(207, 95, 63, .1); color: var(--ink); }
.module-menu-group a span { color: var(--accent); font-size: 18px; }

.auth-layout {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.auth-wrap {
    width: 100%;
    max-width: 560px;
}

.auth-panel {
    padding: 32px;
    border-radius: 28px;
    background: rgba(255, 253, 248, 0.92);
    border: 1px solid rgba(223, 207, 191, 0.92);
    box-shadow: var(--shadow);
}

.auth-panel h1 {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 4vw, 3rem);
    margin: 10px 0 12px;
}

.auth-form {
    display: grid;
    gap: 16px;
    margin: 24px 0;
}

.auth-form label {
    display: grid;
    gap: 8px;
}

.auth-form input {
    width: 100%;
    border: 1px solid var(--line);
    background: white;
    border-radius: 16px;
    padding: 14px 16px;
    font: inherit;
}

.auth-form button {
    border: 0;
    border-radius: 16px;
    padding: 14px 18px;
    background: linear-gradient(135deg, var(--accent), #f0944d);
    color: white;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.alert-error {
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(172, 45, 45, 0.12);
    color: #8d1f1f;
}

.login-help {
    padding: 18px;
    border-radius: 18px;
    background: rgba(207, 95, 63, 0.08);
    color: var(--muted);
}

.login-demo {
    display: grid;
    gap: 12px;
    margin: 20px 0;
    padding: 18px;
    border: 1px dashed var(--accent);
    border-radius: 18px;
    background: rgba(255, 244, 231, 0.72);
}

.login-demo p {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
}

.login-demo__fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.login-demo label {
    display: grid;
    gap: 6px;
}

.login-demo select {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 11px 12px;
    background: white;
    font: inherit;
}

.login-demo .button {
    width: 100%;
}

@media (max-width: 560px) {
    .login-demo__fields {
        grid-template-columns: 1fr;
    }
}

.hero {
    display: grid;
    grid-template-columns: 1.6fr 0.8fr;
    gap: 20px;
    align-items: end;
    margin-bottom: 24px;
}

.hero h1 {
    font-size: clamp(2.2rem, 5vw, 4rem);
    margin: 8px 0 16px;
    line-height: 0.98;
}

.hero p,
.roadmap-card p,
.school-card p,
.panel p {
    color: var(--muted);
    line-height: 1.65;
}

.hero-card,
.stat-card,
.panel,
.school-card,
.roadmap-card {
    background: rgba(255, 253, 248, 0.88);
    border: 1px solid rgba(223, 207, 191, 0.92);
    border-radius: 24px;
    box-shadow: var(--shadow);
}

.hero-card {
    padding: 24px;
}

.hero-card strong {
    display: block;
    font-size: 2rem;
    margin: 8px 0;
}

.hero-card a {
    color: var(--accent);
}

.stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card {
    padding: 22px;
}

.stat-card strong {
    display: block;
    font-size: 2.3rem;
    margin-top: 10px;
}

.panel {
    padding: 24px;
    margin-bottom: 24px;
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 18px;
}

.button-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    border-radius: 999px;
    background: var(--ink);
    color: white;
}

.compact-panel {
    padding: 20px 24px;
}

.action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.action-row .button-link {
    background: #f2e6d7;
    color: var(--ink);
}

.action-row .button-link.is-active {
    background: var(--accent);
    color: white;
}

.button-submit {
    border: 0;
    cursor: pointer;
}

.roadmap,
.school-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.action-card {
    display: block;
    padding: 18px;
    border-radius: 24px;
    background: rgba(255, 253, 248, 0.88);
    border: 1px solid rgba(223, 207, 191, 0.92);
    box-shadow: var(--shadow);
}

.action-card strong {
    display: block;
    font-family: Georgia, "Times New Roman", serif;
    margin-bottom: 8px;
}

.action-card p {
    margin: 0;
    color: var(--muted);
}

.action-card--highlight {
    background: linear-gradient(160deg, rgba(207, 95, 63, 0.16), rgba(244, 200, 164, 0.25));
    border-color: rgba(207, 95, 63, 0.28);
}

.action-card--large {
    min-height: 180px;
}

.roadmap-card,
.school-card {
    padding: 18px;
}

.school-card span {
    display: block;
    color: var(--accent);
    margin: 8px 0;
}

.school-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
}

.phase-summary {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.phase-summary span {
    padding: 10px 12px;
    border-radius: 999px;
    background: rgba(207, 95, 63, 0.08);
    color: var(--accent);
}

.notification-list {
    display: grid;
    gap: 12px;
}

.notification-card {
    padding: 16px 18px;
    border-radius: 18px;
    background: rgba(255, 253, 248, 0.88);
    border: 1px solid rgba(223, 207, 191, 0.92);
}

.info-strip {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(207, 95, 63, 0.08);
    margin-bottom: 18px;
}

.info-strip span {
    color: var(--muted);
}

.receipt-card {
    padding: 24px;
    border-radius: 24px;
    background: rgba(255, 253, 248, 0.9);
    border: 1px solid rgba(223, 207, 191, 0.92);
    box-shadow: var(--shadow);
}

.receipt-card hr {
    border: 0;
    border-top: 1px solid var(--line);
    margin: 18px 0;
}

.alert-success {
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(47, 122, 71, 0.12);
    color: #215b34;
    margin-bottom: 18px;
}

.form-card {
    display: grid;
    gap: 20px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.form-grid label {
    display: grid;
    gap: 8px;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
    width: 100%;
    border: 1px solid var(--line);
    background: white;
    border-radius: 16px;
    padding: 14px 16px;
    font: inherit;
}

.field-span-2 {
    grid-column: span 2;
}

.inline-check {
    display: flex !important;
    align-items: center;
    gap: 10px;
}

.inline-check input {
    width: auto;
}

.inline-check-list {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem 1rem;
    margin-top: .45rem;
}

.rating-field > span {
    display: block;
    margin-bottom: .35rem;
}

.star-rating {
    display: inline-flex;
    gap: .2rem;
}

.star-rating input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.star-rating label {
    color: #c5cbd5;
    cursor: pointer;
    font-size: 1.65rem;
    line-height: 1;
    transition: color .15s ease, transform .15s ease;
}

.star-rating label:hover {
    color: #f6ac28;
    transform: scale(1.12);
}

.star-rating[data-score="1"] label:nth-of-type(-n+1),
.star-rating[data-score="2"] label:nth-of-type(-n+2),
.star-rating[data-score="3"] label:nth-of-type(-n+3),
.star-rating[data-score="4"] label:nth-of-type(-n+4),
.star-rating[data-score="5"] label:nth-of-type(-n+5) {
    color: #f6ac28;
}

.module-table-wrap {
    overflow-x: auto;
}

.module-table {
    width: 100%;
    border-collapse: collapse;
}

.module-table th,
.module-table td {
    padding: 14px 10px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.attendance-status-options {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.attendance-status-option {
    position: relative;
    display: inline-flex;
    cursor: pointer;
}
.attendance-status-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.attendance-status-option span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 700;
    background: var(--card);
}
.attendance-status-option input:checked + span {
    color: #fff;
    border-color: var(--navy);
    background: var(--navy);
}
.attendance-status-absent input:checked + span { background: #bd3d3d; border-color: #bd3d3d; }
.attendance-status-late input:checked + span { background: #c87919; border-color: #c87919; }
.attendance-status-excused input:checked + span { background: #64748b; border-color: #64748b; }
@media (max-width: 760px) {
    .attendance-status-options { min-width: 240px; }
}

.module-table th {
    color: var(--muted);
    font-weight: 600;
}

.form-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

.branch-grid-wrap {
    display: block;
}

.branch-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.branch-teacher-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, 1.3fr) auto;
    gap: 12px;
    align-items: end;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.46);
}

.field-help {
    margin: 0 0 10px;
    color: var(--muted);
    font-size: 0.9rem;
}

.button-muted {
    background: transparent;
    color: var(--accent);
    border: 1px solid var(--line);
}

.finance-status {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
}

.finance-status--overdue {
    color: #a12626;
    background: #ffe3e3;
}

.finance-status--partial {
    color: #a45b00;
    background: #fff0d2;
}

.finance-status--paid {
    color: #167341;
    background: #dcf5e7;
}

.finance-status--neutral {
    color: #546274;
    background: #edf1f5;
}

.list-tools {
    display: grid;
    grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(145px, 1fr)) auto;
    gap: 10px;
    align-items: end;
    margin: 0 0 12px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.56);
}

.inline-form {
    display: inline;
    margin-left: 0.7rem;
}

.list-tools label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.list-tools input,
.list-tools select {
    width: 100%;
    min-height: 38px;
    margin: 0;
}

.list-tools .button-muted {
    min-height: 38px;
    white-space: nowrap;
}

.list-avatar {
    width: var(--avatar-size, 40px);
    min-width: var(--avatar-size, 40px);
    max-width: var(--avatar-size, 40px);
    height: var(--avatar-size, 40px);
    min-height: var(--avatar-size, 40px);
    max-height: var(--avatar-size, 40px);
    overflow: hidden;
    border-radius: 16px;
    object-fit: cover;
    display: inline-block;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(223, 207, 191, 0.92);
    background: rgba(207, 95, 63, 0.08);
    vertical-align: middle;
}

.list-avatar--empty {
    color: var(--muted);
    font-size: 0.9rem;
}

.social-gallery-head { align-items: center; }
.social-gallery-intro { margin: 6px 0 0; }
.social-gallery-filter { display: flex; align-items: end; gap: 14px; padding: 14px; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(207,95,63,.06); }
.social-gallery-filter label { display: grid; gap: 5px; min-width: min(420px, 100%); }
.social-gallery-filter label span { font-size: 12px; color: var(--muted); font-weight: 700; }
.social-gallery-filter select { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: white; font: inherit; }
.social-gallery-count { color: var(--muted); font-size: 13px; }
.social-feed { display: grid; gap: 22px; max-width: 820px; margin: 0 auto; }
.social-post { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 12px 28px rgba(76,49,27,.08); }
.social-post-head { display: flex; align-items: center; gap: 10px; padding: 15px 18px 10px; }
.social-post-head > div:nth-child(2) { display: grid; gap: 2px; min-width: 0; }
.social-post-head span, .social-post-head small, .social-post-title span { color: var(--muted); font-size: 12px; }
.social-post-head > small { margin-left: auto; white-space: nowrap; }
.social-avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), #f0944d); color: white; font-weight: 800; }
.social-post-title { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 4px 18px 14px; }
.social-media-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; background: var(--line); }
.social-media-tile { position: relative; aspect-ratio: 1; overflow: hidden; background: #f3ece5; }
.social-media-tile img, .social-media-tile video { width: 100%; height: 100%; object-fit: cover; display: block; }
.social-media-open { display: block; width: 100%; height: 100%; padding: 0; border: 0; cursor: zoom-in; background: transparent; }
.social-media-tile > span { display: grid; place-items: center; height: 100%; color: var(--muted); font-size: 12px; }
.privacy-badge { position: absolute; left: 6px; bottom: 6px; max-width: calc(100% - 12px); padding: 4px 7px; border-radius: 7px; background: rgba(28,25,23,.72); color: white; font-size: 10px; line-height: 1.2; }
.privacy-badge.is-protected { background: rgba(33,91,52,.9); }
.social-reactions { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 14px 15px; }
.social-edit-link { display: inline-block; margin: 0 14px 16px; color: var(--accent); font-size: 13px; font-weight: 700; }
.social-reactions form { margin: 0; }
.reaction-button { border: 1px solid var(--line); border-radius: 999px; padding: 6px 9px; background: #fffaf3; cursor: pointer; font-size: 17px; }
.reaction-button span { margin-left: 3px; color: var(--muted); font-size: 12px; }
.reaction-button.is-selected { border-color: var(--accent); background: rgba(207,95,63,.13); }
.social-empty { display: grid; gap: 6px; place-items: center; padding: 56px 20px; border: 1px dashed var(--line); border-radius: 20px; color: var(--muted); text-align: center; }
.social-empty strong { color: var(--ink); font-size: 18px; }
.social-lightbox { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 32px; background: rgba(15,12,10,.9); }
.social-lightbox[hidden] { display: none; }
.social-lightbox img { max-width: min(1100px, 94vw); max-height: 90vh; object-fit: contain; border-radius: 12px; }
.social-lightbox-close { position: absolute; top: 18px; right: 24px; border: 0; background: transparent; color: white; font-size: 38px; cursor: pointer; }
.gallery-edit-preview { display: grid; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #fffaf3; }
.gallery-edit-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.gallery-edit-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; }
.gallery-thumb-button { min-height: 48px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); cursor: pointer; }
.gallery-thumb-button.is-active { border-color: #e05535; background: #fff0ea; color: #a93d23; }
.privacy-mask-tool { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fffaf3; }
.privacy-mask-tool > span { color: var(--muted); font-size: 13px; }
.privacy-mask-stage { position: relative; display: inline-block; max-width: 100%; overflow: hidden; border-radius: 12px; background: #eadfd3; touch-action: none; line-height: 0; }
.privacy-mask-stage img { display: block; width: auto; max-width: 100%; height: auto; max-height: 960px; user-select: none; -webkit-user-drag: none; }
#mask-preview { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.privacy-mask-box { position: absolute; border: 3px solid #e05535; background: rgba(224,85,53,.22); pointer-events: none; }
.privacy-mask-box.is-drafting { border-style: dashed; background: rgba(224,85,53,.14); }
.social-ajax-status { min-height: 18px; margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.button-danger { background: #9e2f2f; color: #fff; border-color: #9e2f2f; }
.privacy-face-box { padding: 0; cursor: pointer; pointer-events: auto; }
.privacy-face-box.is-exempt { border-color: #2f9a61; background: rgba(47,154,97,.22); }
.privacy-mask-clear { justify-self: start; padding: 8px 12px; background: #f2e6d7; color: var(--ink); }
@media (max-width: 680px) { .gallery-edit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .social-gallery-filter { align-items: stretch; flex-direction: column; } .social-gallery-filter label { min-width: 0; } .social-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .social-post-head > small { display: none; } }

@media (max-width: 1080px) {
    .shell,
    .hero,
    .stats,
    .roadmap,
    .school-grid,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: relative;
        height: auto;
    }

    .field-span-2 {
        grid-column: auto;
    }

    .branch-grid {
        grid-template-columns: 1fr;
    }

    .branch-teacher-row {
        grid-template-columns: 1fr;
    }

    .list-tools {
        grid-template-columns: 1fr 1fr;
    }

    .list-tools__search {
        grid-column: 1 / -1;
    }

    .module-menu-panel {
        width: min(760px, calc(100vw - 56px));
    }
}

@media (max-width: 680px) {
    .display-scale-control { grid-template-columns: 28px 1fr max-content; width: 100%; }
    .display-scale-control input { grid-column: 2 / -1; width: 100%; }
    .display-scale-control output { grid-column: 2; }
    .display-scale-control button { grid-column: 3; grid-row: 2; }
    .module-menu-panel {
        position: static;
        width: 100%;
        margin-top: 10px;
        grid-template-columns: 1fr;
    }

    .module-menu summary {
        width: 100%;
        justify-content: space-between;
    }

    .list-tools {
        grid-template-columns: 1fr;
    }

    .list-tools__search {
        grid-column: auto;
    }
}

.meal-builder,
.meal-rating-panel {
    display: grid;
    gap: 18px;
    margin: 18px 0;
}

.button-primary { background: #176b57; border-color: #176b57; color: #fff; box-shadow: 0 9px 20px rgba(23, 107, 87, .22); }
.annual-meal-hero, .annual-meal-builder { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px; border-radius: 26px; background: linear-gradient(125deg, #f7e7bd, #fff8e7 45%, #dcefe6); border: 1px solid #e8d7a8; margin-bottom: 18px; }
.annual-meal-hero h1 { margin: 6px 0; }.annual-meal-hero p { max-width: 680px; color: #4e594e; }.annual-meal-builder { background: #fff; border-color: var(--line); }.annual-meal-copy { display: grid; gap: 6px; max-width: 380px; }.annual-meal-copy strong { font-size: 20px; color: #176b57; }.annual-meal-copy span, .annual-month-card small { color: var(--muted); }.annual-meal-form { display: flex; align-items: end; gap: 12px; }.annual-meal-form label { display: grid; gap: 6px; font-weight: 700; }.annual-meal-form select, .annual-meal-form input { min-height: 44px; min-width: 150px; border: 1px solid var(--line); border-radius: 12px; padding: 0 12px; font: inherit; }.annual-submit { min-height: 44px; white-space: nowrap; }.annual-month-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }.annual-month-card { display: grid; gap: 5px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }.annual-month-card strong { font-size: 28px; color: #af6c21; }.annual-month-card.is-ready { border-color: #8ccbb6; background: #f0faf5; }.annual-month-card.is-ready strong { color: #176b57; }
@media (max-width: 760px) { .annual-meal-hero, .annual-meal-builder, .annual-meal-form { align-items: stretch; flex-direction: column; }.annual-month-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.meal-builder-card,
.meal-rating-card {
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 18px;
    background: rgba(255, 255, 255, 0.74);
}

.compact-head {
    margin-bottom: 12px;
}

.food-check-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.food-check {
    display: flex !important;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 12px;
    background: white;
}

.food-check input {
    width: auto;
}

.food-check span,
.food-rating-title {
    display: grid;
    gap: 2px;
}

.food-check small,
.food-rating-title small {
    color: var(--muted);
}

.manual-food-entry { display: grid; gap: 6px; margin-top: 12px; color: var(--muted); font-size: 13px; }.manual-food-entry input { border: 1px dashed var(--accent); border-radius: 12px; padding: 10px; font: inherit; }

.food-rating-row {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) minmax(320px, 2fr) minmax(200px, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.food-rating-row:last-of-type {
    border-bottom: 0;
}

.food-rating-row input[type="text"] {
    width: 100%;
    border: 1px solid var(--line);
    background: white;
    border-radius: 14px;
    padding: 12px 14px;
    font: inherit;
}

.face-rating {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.face-rating label {
    cursor: pointer;
}

.face-rating input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.face-rating span {
    display: grid;
    place-items: center;
    min-width: 58px;
    min-height: 58px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: white;
    font-size: 1.55rem;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.face-rating small {
    font-size: 0.68rem;
    color: var(--muted);
}

.face-rating input:checked + span {
    transform: translateY(-2px);
    border-color: rgba(207, 95, 63, 0.72);
    box-shadow: 0 10px 24px rgba(207, 95, 63, 0.16);
}

@media (max-width: 1080px) {
    .food-check-grid,
    .food-rating-row {
        grid-template-columns: 1fr;
    }
}

.meal-type-picker { display: flex; flex-wrap: wrap; gap: 8px; border: 0; margin: 0; padding: 0; }
.meal-type-picker legend { font-size: 12px; font-weight: 700; }
.meal-type-picker label { font-size: 12px; white-space: nowrap; }
.calendar-event-list { display: grid; gap: 8px; }
.calendar-event-list article { display: flex; gap: 12px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.calendar-event-list strong { color: var(--accent); }
.calendar-event-list small { margin-left: auto; color: var(--muted); }
/* Teacher scheduling */
.quick-bulk-targets{margin-top:12px;border:1px solid var(--line,#e6ddd2);border-radius:12px;padding:10px}.quick-target-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quick-target-columns strong{display:block;margin-bottom:6px;font-size:12px}.quick-target-columns label{display:flex;gap:6px;align-items:center;font-size:12px}.quick-teacher-info{margin-top:8px;padding:8px 10px;border-radius:9px;background:#f2eee8;color:var(--muted);font-size:12px}.quick-bulk-targets small{display:block;margin-top:8px;color:var(--muted);font-size:11px}@media(max-width:560px){.quick-target-columns{grid-template-columns:1fr}}
.quick-bulk-panel{margin:10px 0 14px;border:1px solid var(--line,#e6ddd2);border-radius:14px;background:#fffaf5}.quick-bulk-panel summary{padding:12px 16px;cursor:pointer;font-weight:700}.quick-bulk-form{padding:0 16px 16px}.quick-bulk-columns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.quick-bulk-columns fieldset{min-width:0;border:1px solid var(--line,#e6ddd2);border-radius:12px;padding:10px}.quick-bulk-columns legend{font-size:12px;font-weight:700}.quick-check-list{display:flex;flex-wrap:wrap;gap:6px}.quick-check-list label{display:flex;align-items:center;gap:5px;font-size:12px}.quick-bulk-columns select,.quick-bulk-columns input[type=text],.quick-bulk-time input{width:100%;box-sizing:border-box}.quick-bulk-time{display:grid;grid-template-columns:1fr 1fr 48px;gap:6px}.quick-bulk-form small{display:block;margin-top:6px;color:var(--muted);font-size:11px}@media(max-width:900px){.quick-bulk-columns{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.quick-bulk-columns{grid-template-columns:1fr}}
.assignment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px;margin-top:18px}.check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:12px 0}.check-card{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line,#e6ddd2);border-radius:14px;background:#fff}.check-card span{display:flex;flex-direction:column;min-width:0}.check-card small{color:#786f68}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}@media(max-width:640px){.assignment-grid{grid-template-columns:1fr}.check-grid{grid-template-columns:1fr}}
.quick-schedule-panel{margin-top:18px}.quick-schedule-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}.quick-schedule-toolbar h2{margin:4px 0}.quick-schedule-toolbar p{margin:0;color:var(--muted)}.quick-schedule-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.quick-lesson-palette{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 16px;padding:10px;border:1px solid var(--line,#e6ddd2);border-radius:14px;background:#faf3ec}.quick-lesson-palette>strong{font-size:12px;margin-right:4px}.quick-lesson-card{border:1px solid var(--line,#e6ddd2);border-left:5px solid var(--card-color,#e6e1ff);border-radius:9px;background:#fff;padding:8px 12px;cursor:grab;font:inherit;font-size:12px;color:var(--ink)}.quick-lesson-card:active{cursor:grabbing}.quick-schedule-scroll{overflow-x:auto;border:1px solid var(--line,#e6ddd2);border-radius:16px;background:#fff}.quick-schedule-table{width:100%;min-width:760px;border-collapse:separate;border-spacing:8px;padding:8px}.quick-schedule-table thead th{font-size:13px;color:var(--ink);padding:8px;text-align:center;background:#faf3ec;border-radius:10px}.quick-schedule-table .quick-time{width:74px;vertical-align:middle;background:transparent;text-align:right;padding-right:10px}.quick-schedule-table tbody>tr>th strong,.quick-schedule-table tbody>tr>th small{display:block}.quick-schedule-table tbody>tr>th strong{font-size:14px;color:var(--ink)}.quick-schedule-table tbody>tr>th small{font-size:11px;font-weight:500;margin-top:3px;color:var(--muted)}.quick-schedule-table td{width:18%;min-width:120px;height:78px;padding:0}.quick-schedule-cell{display:flex;min-height:72px;height:100%;box-sizing:border-box;border:1px solid var(--line,#e6ddd2);border-radius:14px;align-items:center;justify-content:center;flex-direction:column;text-align:center;text-decoration:none;color:var(--ink);padding:8px;transition:transform .15s ease,box-shadow .15s ease}.quick-schedule-cell:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(40,30,20,.1)}.quick-schedule-cell.filled{background:var(--cell-color,#e6e1ff);border-color:transparent;cursor:grab}.quick-schedule-cell.empty{background:#fffdfb;font-size:25px;color:var(--accent)}.quick-schedule-cell.readonly{color:var(--muted);font-size:14px}.quick-schedule-cell strong{font-size:12px;line-height:1.2}.quick-schedule-cell small{font-size:10px;line-height:1.2;margin-top:5px;color:var(--muted);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.quick-drop-cell.drag-target .quick-schedule-cell{outline:3px solid var(--accent);outline-offset:2px;background:#fff1e8}@media(max-width:680px){.quick-schedule-panel{padding:12px}.quick-schedule-toolbar{display:block}.quick-schedule-actions{justify-content:flex-start;margin-top:12px}.quick-schedule-table{min-width:650px}}
.quick-editor-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px;background:rgba(30,22,16,.42)}.quick-editor-backdrop[hidden]{display:none}.quick-editor{width:min(560px,100%);padding:22px;border:1px solid var(--line,#e6ddd2);border-radius:20px;background:#fffaf5;box-shadow:0 24px 70px rgba(30,22,16,.25)}.quick-editor-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.quick-editor-head h3{margin:4px 0 0}.quick-editor-close{border:0;background:transparent;font-size:24px;cursor:pointer;color:var(--muted)}.quick-editor label{display:grid;gap:6px;margin-top:12px}.quick-editor label span{font-size:12px;font-weight:700;color:var(--muted)}.quick-editor input,.quick-editor select{width:100%;box-sizing:border-box}.quick-editor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.quick-editor-actions{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;margin-top:20px}.quick-editor-actions .button{white-space:nowrap}@media(max-width:560px){.quick-editor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.quick-steps{margin-bottom:14px;border:1px solid var(--line,#e6ddd2);border-radius:14px;background:#fffaf5}.quick-steps summary{display:flex;align-items:center;gap:14px;padding:12px 16px;cursor:pointer;list-style:none}.quick-steps summary::-webkit-details-marker{display:none}.quick-steps summary strong{font-size:16px}.quick-steps summary>span:last-child{margin-left:auto;color:var(--accent);font-size:12px}.quick-steps[open] summary>span:last-child{display:none}.quick-steps .action-grid{padding:0 12px 12px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.quick-steps .action-card{padding:12px;border-radius:10px}@media(max-width:760px){.quick-steps .action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Dashboard */
.dashboard-hero{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:stretch;margin-bottom:24px}.dashboard-hero__copy,.dashboard-hero__school{border:1px solid var(--line);border-radius:24px;background:rgba(255,253,248,.9);box-shadow:var(--shadow)}.dashboard-hero__copy{padding:32px}.dashboard-hero__copy h1{margin:10px 0 12px;font-size:clamp(2.1rem,4.5vw,3.7rem);line-height:1}.dashboard-hero__copy p{max-width:620px;margin:0;color:var(--muted);line-height:1.7}.dashboard-hero__school{display:flex;flex-direction:column;justify-content:center;padding:28px;background:linear-gradient(150deg,#e0f4ef,#fffdf8 72%)}.dashboard-hero__school span,.dashboard-hero__school small{color:var(--muted)}.dashboard-hero__school strong{margin:8px 0;font-family:Georgia,"Times New Roman",serif;font-size:1.55rem}.dashboard-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}.dashboard-metric{position:relative;overflow:hidden;padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 10px 25px rgba(76,49,27,.08)}.dashboard-metric:after{position:absolute;right:-24px;bottom:-32px;width:100px;height:100px;border-radius:50%;background:currentColor;content:"";opacity:.08}.dashboard-metric span,.dashboard-metric small{display:block;color:var(--muted);font-size:.78rem}.dashboard-metric strong{display:block;margin:8px 0 2px;font-family:Georgia,"Times New Roman",serif;font-size:2.25rem}.dashboard-metric--teal{color:#078f87}.dashboard-metric--blue{color:#2b6db5}.dashboard-metric--orange{color:#c7752c}.dashboard-metric--purple{color:#7653aa}.dashboard-columns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:24px}.dashboard-panel{margin-bottom:24px}.dashboard-actions{display:grid;gap:10px}.dashboard-action{display:grid;grid-template-columns:38px minmax(0,1fr) 24px;align-items:center;gap:12px;padding:15px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.dashboard-action:hover{transform:translateY(-2px);border-color:var(--accent-soft);box-shadow:0 8px 18px rgba(76,49,27,.1)}.dashboard-action.is-primary{background:linear-gradient(110deg,#e3f5ef,#fff)}.dashboard-action__number{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#f6e7d8;color:var(--accent);font-size:.75rem;font-weight:700}.dashboard-action strong,.dashboard-action small{display:block}.dashboard-action small{margin-top:3px;color:var(--muted);font-size:.82rem}.dashboard-action b{color:var(--accent);font-size:1.2rem}.notification-card{display:flex;align-items:flex-start;gap:10px}.notification-dot{flex:0 0 8px;width:8px;height:8px;margin-top:6px;border-radius:50%;background:#13a69e;box-shadow:0 0 0 5px rgba(19,166,158,.1)}.text-link{color:var(--accent);font-weight:600}.empty-state{display:grid;gap:5px;padding:22px;border:1px dashed var(--line);border-radius:16px;color:var(--muted)}.empty-state strong{color:var(--ink)}
@media(max-width:1080px){.dashboard-hero,.dashboard-columns{grid-template-columns:1fr}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.dashboard-hero__copy,.dashboard-hero__school{padding:22px;border-radius:18px}.dashboard-hero__copy h1{font-size:2.35rem}.dashboard-metrics{gap:10px}.dashboard-metric{padding:16px}.dashboard-metric strong{font-size:1.8rem}.dashboard-action{grid-template-columns:32px minmax(0,1fr) 20px;padding:13px}.dashboard-action__number{width:30px;height:30px}.dashboard-action small{font-size:.75rem}}

/* Anaokulum Hibrit UI renk sistemi */
:root{--bg:#f7f3ea;--paper:#fbf9f4;--ink:#173257;--muted:#6b7a90;--accent:#13b8b0;--accent-soft:#ddf7f4;--line:#e8e2d8;--card:#fff;--shadow:0 8px 24px rgba(16,46,89,.08);--navy:#102e59;--success:#20a968;--warning:#f49a31;--danger:#e34e4a;--info:#4c91e6;--purple:#8267d9}
 .shell{grid-template-columns:260px 1fr}
body{font-family:Inter,Manrope,"Segoe UI",Tahoma,sans-serif;background:var(--bg);color:var(--ink)}
.sidebar{width:auto;padding:24px 18px;border-right:1px solid var(--line);background:var(--paper);backdrop-filter:none}.brand{margin-bottom:28px}.brand-mark{width:42px;height:42px;border-radius:12px;background:var(--accent);box-shadow:none}.brand strong,.hero h1,.panel h2,.panel h1,.roadmap-card h3,.school-card strong,.stat-card strong,.dashboard-hero__school strong,.dashboard-action strong{font-family:Inter,Manrope,"Segoe UI",sans-serif}.brand strong{color:var(--navy)}.brand small{color:var(--muted)}.nav{gap:5px}.nav-link{padding:11px 12px;border-radius:10px;color:var(--muted);letter-spacing:0;text-transform:none;font-size:.9rem}.nav-link:hover,.nav-link.is-active{background:var(--accent-soft);color:var(--navy)}.sidebar-user{margin-top:20px;padding:13px;border-radius:12px;background:#eef8f6}.content{padding:24px}.module-menu-toggle,.module-menu-panel{border-color:var(--line);background:var(--card);box-shadow:var(--shadow)}.module-menu-toggle{border-radius:12px}.module-menu-icon,.module-menu-group h2,.module-menu-group a span{color:var(--accent)}.module-menu-group a:hover{background:var(--accent-soft);color:var(--navy)}.panel,.hero-card,.stat-card,.school-card,.roadmap-card,.action-card{background:var(--card);border-color:var(--line);border-radius:16px;box-shadow:var(--shadow)}.panel{padding:20px}.button-link,.button-submit{background:var(--navy);border-radius:10px}.action-row .button-link{background:var(--accent-soft);color:var(--navy)}.action-row .button-link.is-active{background:var(--accent);color:#fff}.dashboard-hero__copy,.dashboard-hero__school{border-color:var(--line);background:var(--card);box-shadow:var(--shadow)}.dashboard-hero__copy{padding:28px}.dashboard-hero__school{background:linear-gradient(145deg,var(--accent-soft),var(--card) 72%)}.dashboard-hero__copy h1{color:var(--navy);font-weight:700}.dashboard-metric{border-color:var(--line);box-shadow:var(--shadow)}.dashboard-metric--teal{color:var(--accent)}.dashboard-metric--blue{color:var(--info)}.dashboard-metric--orange{color:var(--warning)}.dashboard-metric--purple{color:var(--purple)}.dashboard-action{border-color:var(--line);box-shadow:none}.dashboard-action.is-primary{background:var(--accent-soft)}.dashboard-action__number{background:var(--accent-soft);color:var(--dark,#079b96)}.dashboard-action b,.text-link{color:var(--accent)}.notification-dot{background:var(--accent);box-shadow:0 0 0 5px rgba(19,184,176,.12)}

/* Referans gösterge paneli düzeni */
.overview-heading{display:flex;align-items:center;gap:10px;margin:8px 0 16px}.overview-heading__icon{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;background:#fff4d8;color:var(--warning);font-size:20px}.overview-heading h1{margin:0;color:var(--navy);font-size:1.35rem;line-height:1.15}.overview-heading p{margin:3px 0 0;color:var(--muted);font-size:.73rem}.overview-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}.overview-metric,.overview-card{border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:0 4px 14px rgba(16,46,89,.055)}.overview-metric{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;padding:15px;min-height:132px}.overview-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;font-size:19px}.overview-metric--attendance .overview-icon{background:var(--success)}.overview-metric--collection .overview-icon{background:#20aaa2}.overview-metric--tasks .overview-icon{background:var(--warning)}.overview-metric small,.overview-metric em{display:block;font-style:normal}.overview-metric small{color:var(--navy);font-size:.74rem;font-weight:700}.overview-metric strong{display:block;margin:3px 0;color:var(--navy);font-size:1.34rem;line-height:1.1}.overview-metric em{color:var(--muted);font-size:.63rem}.overview-metric a{grid-column:1/-1;align-self:end;color:var(--accent);font-size:.67rem;font-weight:700}.overview-metric a b{float:right;font-size:1rem;line-height:.7}.overview-grid{display:grid;gap:12px;margin-bottom:12px}.overview-grid--primary{grid-template-columns:1.12fr 1.55fr 1.02fr}.overview-grid--secondary{grid-template-columns:1fr 1.32fr 1.1fr}.overview-grid--footer{grid-template-columns:1fr 2fr}.overview-card{padding:15px;min-width:0}.overview-card h2{margin:0 0 12px;color:var(--navy);font-size:.86rem}.overview-action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.overview-action{display:grid;justify-items:center;gap:6px;min-height:72px;padding:8px 4px;border-radius:9px;color:var(--navy);text-align:center}.overview-action:hover{background:var(--accent-soft)}.overview-action span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#e8f6f4;color:var(--accent);font-weight:800}.overview-action small{font-size:.62rem;line-height:1.15}.overview-list{display:grid;gap:3px}.overview-list>a{display:flex;align-items:center;gap:8px;min-width:0;padding:5px 3px;border-radius:6px;color:var(--muted);font-size:.67rem}.overview-list>a:hover{background:#f7fbfa}.overview-list>a>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.overview-list em{margin-left:auto;color:var(--warning);font-size:.62rem;font-style:normal}.overview-warning{color:var(--warning);font-size:.62rem}.overview-footer-link{display:block;margin-top:12px;color:var(--accent);font-size:.65rem;font-weight:700;text-align:center}.overview-list--schedule a{display:grid;grid-template-columns:82px minmax(0,1fr)}.overview-list--schedule strong{color:var(--muted);font-size:.65rem}.overview-list--schedule span{overflow:hidden;color:var(--navy);font-size:.66rem;text-overflow:ellipsis;white-space:nowrap}.overview-list--meal a{padding:7px 3px}.overview-list--meal a>span{font-size:15px;color:var(--muted)}.overview-list--meal strong{color:var(--navy);font-size:.7rem}.overview-list--announcements a{align-items:flex-start;padding:6px 3px}.overview-list--announcements a>span{color:var(--accent);font-size:15px}.overview-list--announcements strong,.overview-list--announcements small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.overview-list--announcements strong{color:var(--navy);font-size:.68rem}.overview-list--announcements small{margin-top:2px;color:var(--muted);font-size:.59rem}.overview-empty{padding:12px 2px;color:var(--muted);font-size:.67rem}.overview-finance{display:flex;align-items:center;justify-content:center;gap:14px;min-height:112px}.overview-donut{display:grid;place-content:center;width:105px;height:105px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--value) * 1%),var(--warning) 0 100%);position:relative;text-align:center}.overview-donut:before{position:absolute;inset:12px;border-radius:50%;background:var(--card);content:""}.overview-donut strong,.overview-donut small{position:relative;z-index:1}.overview-donut strong{color:var(--navy);font-size:.72rem}.overview-donut small{margin-top:3px;color:var(--muted);font-size:.58rem}.overview-finance-legend{display:grid;gap:7px}.overview-finance-legend span{display:grid;grid-template-columns:8px auto;column-gap:6px;align-items:center;color:var(--muted);font-size:.62rem}.overview-finance-legend i{width:7px;height:7px;border-radius:50%;background:var(--accent)}.overview-finance-legend .is-pending{background:var(--warning)}.overview-finance-legend b{grid-column:2;color:var(--navy);font-size:.62rem}.overview-staff-card>div{display:grid;grid-template-columns:auto 1fr;gap:4px 9px;align-items:baseline}.overview-staff-card strong{color:var(--navy);font-size:1.15rem}.overview-staff-card span{color:var(--muted);font-size:.62rem}.overview-classroom-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.overview-classroom-list a{display:grid;gap:3px;padding:6px;border-left:2px solid var(--accent);border-radius:6px;background:#f9fcfb}.overview-classroom-list span{overflow:hidden;color:var(--navy);font-size:.66rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.overview-classroom-list small{color:var(--muted);font-size:.59rem}.overview-classroom-list b{color:var(--success);font-size:.63rem}
@media(max-width:1160px){.overview-grid--primary{grid-template-columns:1fr 1fr}.overview-card--schedule{grid-column:1/-1}.overview-grid--secondary{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-finance-card{grid-column:1/-1}.overview-grid--footer{grid-template-columns:1fr}.overview-classroom-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.overview-metrics,.overview-grid--primary,.overview-grid--secondary{grid-template-columns:1fr}.overview-card--schedule,.overview-finance-card{grid-column:auto}.overview-metric{min-height:112px}.overview-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.overview-classroom-list{grid-template-columns:1fr 1fr}.overview-finance{justify-content:flex-start}.overview-heading h1{font-size:1.15rem}}

/* Rol izinleri: teknik kodlar yerine sade, islem odakli secim listesi. */
.permission-guide{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:16px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--accent-soft);font-size:.82rem}.permission-guide strong{color:var(--navy)}.permission-guide b{color:var(--navy)}.permission-list{display:grid;gap:10px}.permission-row{display:grid;grid-template-columns:minmax(230px,.9fr) minmax(360px,1.1fr);gap:18px;align-items:center;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.permission-row__info h2,.permission-dashboard h2{margin:0 0 5px;color:var(--navy);font-size:1rem}.permission-row__info p,.permission-dashboard p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.45}.permission-row__choices{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.permission-choice{display:flex;align-items:flex-start;gap:8px;min-width:145px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}.permission-choice:hover{border-color:var(--accent);background:#fbfffe}.permission-choice input{margin-top:3px;accent-color:var(--accent)}.permission-choice strong,.permission-choice small{display:block}.permission-choice strong{color:var(--navy);font-size:.82rem}.permission-choice small{margin-top:2px;color:var(--muted);font-size:.68rem;line-height:1.35}.permission-dashboard{margin-top:14px;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--accent-soft)}.permission-dashboard-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;margin-top:12px}@media(max-width:760px){.permission-row{grid-template-columns:1fr}.permission-row__choices{justify-content:flex-start}.permission-dashboard-list{grid-template-columns:1fr}.permission-guide{display:grid;gap:6px}}

.permission-tree{gap:12px}.permission-category,.permission-module{border:1px solid var(--line);border-radius:12px;background:var(--card)}.permission-category>summary,.permission-module>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none}.permission-category>summary::-webkit-details-marker,.permission-module>summary::-webkit-details-marker{display:none}.permission-category>summary{padding:14px 16px;color:var(--navy);font-weight:800}.permission-category>summary small{color:var(--muted);font-weight:600}.permission-category>summary:after,.permission-module>summary:after{content:'+';font-size:1.2rem;color:var(--accent)}.permission-category[open]>summary:after,.permission-module[open]>summary:after{content:'−'}.permission-category__body{display:grid;gap:8px;padding:0 12px 12px}.permission-module>summary{padding:12px 14px;background:#fbfdfc}.permission-module>summary span{display:grid;gap:4px}.permission-module>summary strong{color:var(--navy)}.permission-module>summary small{color:var(--muted);font-size:.78rem;line-height:1.35}.permission-module__choices{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px 14px}.permission-module__choices .permission-choice{flex:1;min-width:190px}.permission-choice--locked{cursor:not-allowed;background:#fff8ed}@media(max-width:760px){.permission-module__choices{display:grid}.permission-module__choices .permission-choice{min-width:0}}

.guardian-student-section{display:grid;gap:12px;padding:16px;border:1px solid var(--line);border-radius:14px;background:#f7fbfa}.guardian-student-section .section-head{margin:0}.guardian-student-section .section-head small{display:block;margin-top:4px;color:var(--muted)}.guardian-student-section .button-link{border:0;cursor:pointer;font:inherit}.guardian-student-rows{display:grid;gap:10px}.guardian-student-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff}.guardian-student-row label{display:grid;gap:5px}.guardian-student-row label span{font-size:.78rem;color:var(--muted)}.inline-remove{grid-column:1/-1;justify-self:start;border:0;background:transparent;color:var(--danger);cursor:pointer;font:inherit;font-size:.82rem;font-weight:700;padding:2px 0}@media(max-width:760px){.guardian-student-row{grid-template-columns:1fr 1fr}.guardian-student-section .section-head{display:grid;gap:10px}.guardian-student-section .button-link{justify-self:start}}@media(max-width:480px){.guardian-student-row{grid-template-columns:1fr}}
.linked-students-overlay{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:7px 0 9px;padding:9px 11px;border:1px solid #f4b27a;border-radius:10px;background:#fff0e2;color:#8d3c11;font-size:.79rem}.linked-students-overlay b{margin-right:3px}.linked-students-overlay em{padding:4px 8px;border-radius:999px;background:#f59b52;color:#fff;font-style:normal;font-weight:700}
.captcha-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
}
.student-observation-section{display:grid;gap:12px}.field-help{margin:0;color:var(--muted);font-size:.85rem}.student-observation-card{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:14px;background:#fff}.student-observation-card h3{margin:0;color:var(--navy);font-size:1rem}.student-observation-card small{color:var(--muted)}.student-observation-card[hidden]{display:none}.student-observation-summary{padding:5px 0;color:var(--ink);font-size:.82rem}.student-observation-summary+ .student-observation-summary{border-top:1px solid var(--line)}

.mobile-sidebar-toggle,.mobile-sidebar-backdrop{display:none}

@media(max-width:760px){
    body{overflow-x:hidden}
    .shell{display:block;min-height:100vh}
    .sidebar{display:none}
    .mobile-sidebar-toggle,.mobile-sidebar-backdrop{display:none}
    .content{width:100%;min-width:0;padding:14px 12px 28px}
    .content-scale-target{min-width:0}
    .module-menu-panel{max-width:100%;overflow:hidden}
    .overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
    .overview-metric{min-width:0;padding:12px;grid-template-columns:32px minmax(0,1fr);gap:8px}
    .overview-metric strong{font-size:1.2rem}
    .overview-grid--primary,.overview-grid--secondary{grid-template-columns:1fr}
    .overview-card--schedule,.overview-finance-card{grid-column:auto}
    .overview-action-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .overview-classroom-list{grid-template-columns:1fr 1fr}
}
