:root { --red:#b91c1c; --dark:#17212b; --muted:#64748b; --line:#dbe2e8; --paper:#f4f6f8; --white:#fff; --green:#15803d; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,Segoe UI,Arial,sans-serif; color:var(--dark); background:var(--paper); }
a { color:inherit; }
button,.button,input,select,textarea { font:inherit; }
button,.button { border:0; border-radius:.55rem; padding:.7rem 1rem; cursor:pointer; background:var(--red); color:white; text-decoration:none; display:inline-block; }
.button.secondary { background:#475569; }
.button.danger { background:#7f1d1d; }
input,select,textarea { width:100%; border:1px solid #b8c3ce; border-radius:.45rem; padding:.65rem; background:#fff; }
label { display:grid; gap:.35rem; font-weight:600; }
.shell { max-width:1200px; margin:auto; padding:1.5rem; }
.topbar { background:var(--dark); color:#fff; }
.topbar .shell { display:flex; justify-content:space-between; align-items:center; padding-block:.8rem; }
.topbar nav { display:flex; gap:.7rem; align-items:center; }
.card { background:#fff; border:1px solid var(--line); border-radius:.8rem; padding:1.25rem; box-shadow:0 2px 8px #0f172a0a; margin-bottom:1rem; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.grid .wide { grid-column:1/-1; }
.actions { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.notice { border-left:5px solid #d97706; background:#fffbeb; padding:.8rem 1rem; margin:1rem 0; }
.success { border-left-color:var(--green); background:#f0fdf4; }
table { width:100%; border-collapse:collapse; background:#fff; }
th,td { padding:.75rem; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { background:#eef2f6; }
.badge { display:inline-block; border-radius:999px; padding:.2rem .55rem; background:#e2e8f0; font-size:.85rem; }
.badge.warning { background:#fef3c7; color:#92400e; }
.login { max-width:430px; margin:10vh auto; }
.login form { display:grid; gap:1rem; }

/* Monitor */
.display { background:#101820; color:white; width:100vw; height:100vh; overflow:hidden; }
.slide { display:none; width:100%; height:100%; padding:4vh 5vw; position:absolute; inset:0; background:linear-gradient(145deg,#121d27,#263746); }
.slide.active { display:flex; animation:fade .5s ease; }
@keyframes fade { from { opacity:0 } to { opacity:1 } }
.slide-welcome { flex-direction:column; justify-content:center; align-items:center; text-align:center; }
.slide-welcome h1 { font-size:clamp(3rem,7vw,7rem); margin:.25em 0; }
.slide-welcome p { font-size:clamp(1.5rem,2.5vw,3rem); max-width:75vw; }
.logo { max-height:20vh; max-width:35vw; object-fit:contain; }
.slide-plan { align-items:center; justify-content:center; flex-direction:column; }
.slide-plan img { max-height:82vh; max-width:90vw; object-fit:contain; border-radius:.5rem; background:#fff; }
.slide h2 { font-size:clamp(2.2rem,4vw,4.5rem); margin:0 0 2.5vh; }
.slide-courses { flex-direction:column; padding:2.5vh 2.7vw 5vh; background:radial-gradient(circle at 50% -20%,#304457 0,#14212c 48%,#0b141d 100%); }
.slide-courses::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.22; background-image:linear-gradient(#8da2b31a 1px,transparent 1px),linear-gradient(90deg,#8da2b31a 1px,transparent 1px); background-size:42px 42px; }
.system-header { position:relative; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #668097; padding-bottom:1.2vh; margin-bottom:1.6vh; }
.system-header h2 { margin:.25vh 0 0; text-transform:uppercase; letter-spacing:.025em; font-size:clamp(1.8rem,2.8vw,3.4rem); line-height:1; }
.system-kicker { color:#8fa8bb; font-size:clamp(.65rem,.9vw,1.05rem); font-weight:700; letter-spacing:.2em; }
.system-status { display:flex; align-items:center; gap:.75rem; color:#a7f3d0; font-size:clamp(.75rem,1vw,1.1rem); font-weight:800; letter-spacing:.14em; }
.system-status i,.live-state i { width:.65rem; height:.65rem; border-radius:50%; background:#34d399; box-shadow:0 0 0 .25rem #34d39920,0 0 1.2rem #34d399; }
.technical-table-wrap { position:relative; z-index:1; flex:1; min-height:0; display:flex; align-items:stretch; border:1px solid #668097; box-shadow:0 1.4vh 3vh #0007; }
.technical-course-table { width:100%; height:100%; table-layout:fixed; border-collapse:collapse; background:#e8eef3; color:#101c27; }
.technical-course-table th { height:4.8vh; padding:.65vh .7vw; background:#172a39; color:#a9bdcc; border:0; border-right:1px solid #506779; font-size:clamp(.54rem,.67vw,.82rem); font-weight:850; letter-spacing:.1em; }
.technical-course-table th:nth-child(1) { width:5.5%; }
.technical-course-table th:nth-child(2) { width:34.5%; }
.technical-course-table th:nth-child(3) { width:18%; }
.technical-course-table th:nth-child(n+4) { width:14%; }
.technical-course-table td { padding:.85vh .85vw; border:0; border-right:1px solid #9eafbc; border-bottom:1px solid #91a5b5; vertical-align:middle; background:linear-gradient(90deg,#f8fafc,#e5ebf0); }
.technical-course-table tbody tr:last-child td { border-bottom:0; }
.technical-course-table tbody tr { height:23%; border-left:.4rem solid #dc2626; }
.technical-course-table tbody tr:nth-child(even) td { background:linear-gradient(90deg,#edf2f5,#dce5eb); }
.course-sequence { text-align:center; color:#526979; font-size:clamp(1rem,1.25vw,1.55rem); font-weight:900; font-variant-numeric:tabular-nums; }
.course-sequence span { display:block; color:#b91c1c; font-size:.48em; letter-spacing:.12em; }
.course-title-cell strong { display:block; font-size:clamp(1.25rem,1.75vw,2.25rem); line-height:1.05; text-transform:uppercase; overflow-wrap:anywhere; }
.course-title-cell small { display:block; margin-top:.55vh; color:#526675; font-size:clamp(.68rem,.87vw,1.05rem); line-height:1.15; font-weight:650; }
.course-room-cell { background:#142330 !important; color:#fff; }
.course-room-cell span,.course-time span { display:block; color:#8fa6b8; font-size:clamp(.52rem,.65vw,.8rem); font-weight:850; letter-spacing:.1em; }
.course-room-cell strong { display:block; margin-top:.35vh; color:#fff; font-size:clamp(1.2rem,1.65vw,2.05rem); line-height:1.05; text-transform:uppercase; }
.course-time { text-align:center; }
.course-time span { color:#647888; }
.course-time strong { display:block; margin-top:.35vh; font-size:clamp(1.15rem,1.6vw,2rem); font-variant-numeric:tabular-nums; }
.technical-empty { display:flex; flex-direction:column; gap:1rem; padding:4rem; border:1px solid #61788b; background:#101d27cc; }
.technical-empty span { color:#34d399; font-size:.9rem; letter-spacing:.2em; }
.empty-state { margin:auto; font-size:clamp(1.6rem,3vw,3rem); text-align:center; }
.clock { position:absolute; right:3vw; bottom:2vh; opacity:.75; font-size:clamp(1rem,1.4vw,1.6rem); }
@media (max-width:760px) { .grid { grid-template-columns:1fr; } .table-wrap { overflow:auto; } .topbar .shell { align-items:flex-start; gap:1rem; flex-direction:column; } }