.management-page { min-height: 100vh; background: #07182d; color: #eff8ff; }
.management-header { min-height: 72px; padding: 12px clamp(18px,4vw,52px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #244a68; background: #081c35; }
.management-header .brand { display: flex; align-items: center; gap: 10px; }
.management-header .brand img { width: 38px; height: 38px; }
.management-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.management-actions button, .account [data-open-management] { border: 1px solid #315978; color: #eff8ff; background: #0d2b4b; border-radius: 10px; padding: 9px 13px; font: inherit; font-weight: 700; cursor: pointer; }
.management-shell { width: min(1440px, calc(100% - 32px)); margin: 0 auto; padding: 36px 0 70px; }
.management-title { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 24px; }
.management-title h1 { margin: 7px 0 5px; font-size: clamp(1.8rem,4vw,3rem); }
.management-title p { margin: 0; color: #9fb8ce; }
.management-message { min-height: 24px; color: #73e2dc !important; text-align: right; }
.management-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 20px; }
.management-stats article { padding: 21px 24px; border: 1px solid #285170; border-radius: 17px; background: linear-gradient(145deg,#0b2845,#0c2139); }
.management-stats span { display: block; color: #9fb8ce; font-weight: 700; }
.management-stats strong { display: block; margin-top: 4px; font-size: 2rem; color: #69ded9; }
.management-forms { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 20px; }
.management-forms details { border: 1px solid #285170; border-radius: 15px; background: #0b223a; overflow: hidden; }
.management-forms summary { cursor: pointer; padding: 17px 19px; font-weight: 800; color: #eef8ff; }
.management-forms form { display: grid; gap: 12px; padding: 4px 18px 19px; }
.management-forms label { display: grid; gap: 6px; color: #b9cde0; font-size: .86rem; font-weight: 700; }
.management-forms input, .management-forms select { width: 100%; min-height: 43px; border: 1px solid #3a6280; border-radius: 10px; background: #f6f9fd; color: #102b46; padding: 9px 11px; font: inherit; }
.management-forms .check { grid-template-columns: auto 1fr; align-items: start; font-weight: 500; line-height: 1.4; }
.management-forms .check input { width: 17px; min-height: 17px; }
.management-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.management-card { border: 1px solid #285170; border-radius: 17px; background: #0a2139; padding: 20px; min-width: 0; }
.card-title { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 13px; }
.card-title h2 { margin: 0; font-size: 1.15rem; }
.card-title small { color: #8fa9c0; }
.card-title > span { display: grid; place-items: center; min-width: 34px; height: 30px; padding: 0 8px; border-radius: 99px; background: #174363; color: #71e2dc; font-weight: 800; }
.data-list { display: grid; gap: 8px; }
.data-row { display: grid; grid-template-columns: minmax(150px,1.4fr) minmax(110px,1fr) auto; align-items: center; gap: 12px; padding: 12px 13px; border: 1px solid #244762; border-radius: 11px; background: #0c2945; }
.data-row strong, .data-row span, .data-row small { min-width: 0; overflow-wrap: anywhere; }
.data-row small { color: #9cb4ca; }
button.data-row { width: 100%; color: inherit; text-align: left; cursor: pointer; font: inherit; }
button.data-row:hover, button.data-row:focus-visible { border-color: #69ded9; background: #113654; outline: none; }
.row-badge { padding: 5px 8px; border-radius: 99px; background: #173e5c; color: #75e3dc; font-size: .78rem; font-weight: 800; white-space: nowrap; }
.empty-row { padding: 18px; color: #8fa9c0; text-align: center; border: 1px dashed #31526c; border-radius: 11px; }
.students-card { margin-bottom: 16px; }
.student-detail { position: relative; border: 1px solid #54cfc9; border-radius: 18px; background: #0b263f; padding: clamp(20px,4vw,34px); }
.student-detail h2 { margin: 6px 0; font-size: 1.8rem; }
.student-detail > p { color: #a8bfd2; }
.student-detail h3 { margin: 28px 0 11px; }
.detail-close { position: absolute; right: 16px; top: 14px; width: 38px; height: 38px; border-radius: 50%; border: 1px solid #42647e; background: #102f4b; color: white; font-size: 1.5rem; cursor: pointer; }
.detail-skills { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-top: 18px; }
.detail-skill { padding: 15px; border-radius: 13px; background: #123652; border: 1px solid #315673; }
.detail-skill span { display: block; color: #9eb5c9; text-transform: capitalize; }
.detail-skill strong { display: block; margin-top: 5px; font-size: 1.35rem; color: #6ee1db; }
.detail-skill small { display: block; margin-top: 7px; color: #afc5d7; line-height: 1.4; }
@media (max-width: 900px) { .management-forms { grid-template-columns: 1fr; } .management-grid { grid-template-columns: 1fr; } .detail-skills { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .management-header { align-items: flex-start; } .management-header .brand b { max-width: 100px; } .management-shell { width: min(100% - 20px,1440px); padding-top: 22px; } .management-title { display: block; } .management-message { text-align: left; margin-top: 10px !important; } .management-stats { grid-template-columns: 1fr 1fr 1fr; gap: 7px; } .management-stats article { padding: 13px 10px; } .management-stats strong { font-size: 1.45rem; } .data-row { grid-template-columns: 1fr auto; } .data-row small { grid-column: 1 / -1; } }