:root{--ink:#13233f;--muted:#66758c;--blue:#145da0;--blue-dark:#0b315f;--orange:#f47b20;--paper:#f4f8fc;--line:#dce6f1;--heavy:#f47b20;--light:#1976c9;--green:#145da0;--mint:#e8f2fc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'IBM Plex Sans Thai',sans-serif;display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh}aside{background:linear-gradient(180deg,var(--blue-dark),var(--blue));color:#fff;padding:32px 22px;position:fixed;width:250px;height:100vh;box-shadow:8px 0 30px rgba(11,49,95,.08)}.brand{display:flex;gap:12px;align-items:center;font-size:20px;font-weight:700}.brand>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#fff;background:var(--orange)}.brand small{display:block;font-size:10px;color:#c9ddf2;font-weight:400}nav{margin-top:55px;display:grid;gap:8px}nav a{color:#d7e8f8;text-decoration:none;padding:12px 14px;border-radius:9px;font-size:14px}nav a.active,nav a:hover{background:rgba(255,255,255,.15);color:#fff;border-left:3px solid var(--orange)}.side-note{position:absolute;bottom:28px;border-top:1px solid rgba(255,255,255,.22);padding:20px 6px 0}.side-note b{font-size:13px}.side-note p{font-size:11px;color:#c9ddf2;line-height:1.7}main{grid-column:2;padding:38px 4vw 70px;max-width:1500px;width:100%;margin:auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}h1,h2,h3,p{margin:0}h1{font-size:30px}header>div>p:last-child,.hero p{color:var(--muted);font-size:14px}.eyebrow{font-size:10px!important;letter-spacing:2px;color:var(--orange)!important;font-weight:700;margin-bottom:6px}.people{display:grid;text-align:right}.people b{font-size:26px;color:var(--blue)}.people span{font-size:11px;color:var(--muted)}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin-bottom:22px;box-shadow:0 8px 25px rgba(20,93,160,.045)}.hero{display:flex;justify-content:space-between;align-items:end;border-left:5px solid var(--orange)}.hero form,.task-form{display:flex;gap:10px;align-items:end}label{display:grid;gap:5px;color:#53647b;font-size:11px;font-weight:600}input,select{height:40px;border:1px solid #cbd9e7;border-radius:7px;padding:0 12px;background:#fff;font:inherit;color:var(--ink);min-width:175px}input:focus,select:focus{outline:2px solid #bfdcf5;border-color:var(--blue)}button{border:0;font:inherit;cursor:pointer}.primary,.dark{height:40px;padding:0 18px;border-radius:7px;color:#fff;background:var(--orange);font-weight:600;transition:.2s}.dark{background:var(--blue)}.primary:hover,.dark:hover{transform:translateY(-1px);box-shadow:0 6px 15px rgba(20,93,160,.22)}.schedule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:22px}.day-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}.day-head{display:flex;justify-content:space-between;padding:19px 20px;background:#f5f9fd;border-top:3px solid var(--orange);border-bottom:1px solid var(--line)}.day-head small{font-size:9px;letter-spacing:1.5px;color:var(--blue)}.day-head h3{font-size:18px}.day-head time{font-size:11px;color:var(--muted)}.assignment{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid #edf2f7}.assignment:last-child{border:0}.type{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:11px;font-weight:700}.type.heavy{background:#fff0e5;color:var(--heavy)}.type.light{background:#e6f2fc;color:var(--light)}.assignment b{display:block;font-size:13px}.assignment small{display:block;color:var(--muted);font-size:11px;margin-top:2px}em{font-style:normal;font-size:9px;font-weight:700;letter-spacing:.7px;padding:4px 7px;border-radius:4px}em.heavy,strong.heavy{color:var(--heavy);background:#fff0e5}em.light,strong.light{color:var(--light);background:#e6f2fc}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-title h2{font-size:20px}.section-title>span{font-size:11px;color:var(--muted)}.task-form{display:grid;grid-template-columns:2fr 1.2fr 1fr .7fr auto;background:#f3f7fb;padding:15px;border-radius:9px}.task-form input,.task-form select{width:100%;min-width:0}.task-list{margin-top:12px}.task-list>div{display:grid;grid-template-columns:12px minmax(0,1fr) 180px 70px 30px;gap:12px;align-items:center;padding:11px;border-bottom:1px solid #edf2f7;font-size:13px}.task-list small{color:var(--muted)}.dot{width:7px;height:7px;border-radius:50%}.dot.heavy{background:var(--orange)}.dot.light{background:var(--blue)}.delete{background:transparent;color:#9ba7b5;font-size:20px}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}table{width:100%;border-collapse:collapse;font-size:13px;min-width:650px}th{text-align:left;color:#66758c;font-size:10px;text-transform:uppercase;letter-spacing:.5px;padding:10px;border-bottom:1px solid var(--line)}td{padding:11px 10px;border-bottom:1px solid #edf2f7}td:first-child{display:flex;align-items:center;gap:9px}.avatar{width:30px;height:30px;border-radius:8px;background:var(--mint);color:var(--blue);display:grid;place-items:center;font-weight:700}strong.heavy,strong.light{display:inline-grid;place-items:center;width:30px;height:25px;border-radius:5px}.flash{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:13px}.flash.success{background:#e5f2ff;color:var(--blue-dark);border-left:4px solid var(--blue)}.flash.error{background:#fff0e5;color:#a7470b;border-left:4px solid var(--orange)}.empty{text-align:center;background:#fff;border:1px dashed #b9cade;padding:50px;color:var(--muted);border-radius:14px;margin-bottom:22px}footer{grid-column:2;text-align:center;color:#8493a7;font-size:10px;padding-bottom:20px}
@media(max-width:1180px){.schedule-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.day-card:last-child{grid-column:1/-1}.task-form{grid-template-columns:repeat(2,minmax(0,1fr))}.task-form button{width:100%}}
@media(max-width:900px){body{display:block}aside{position:sticky;top:0;z-index:20;width:100%;height:auto;padding:14px 4%;display:flex;align-items:center;justify-content:space-between}.brand>span{width:36px;height:36px}nav{display:flex;margin:0;gap:3px}nav a{padding:9px 10px;font-size:12px}nav a.active,nav a:hover{border-left:0;border-bottom:2px solid var(--orange)}.side-note{display:none}main{padding:25px 4%}.hero{align-items:stretch;gap:20px}.hero,.hero form{flex-direction:column}.hero form{display:grid;grid-template-columns:1fr auto}.hero input{width:100%}.schedule-grid{grid-template-columns:1fr}.day-card:last-child{grid-column:auto}footer{grid-column:auto}}
@media(max-width:600px){aside{position:static}.brand small,nav{display:none}main{padding:20px 14px 45px}header{align-items:end;margin-bottom:20px}h1{font-size:24px}.people{display:none}.panel{padding:17px;border-radius:11px}.hero form,.task-form{display:grid;grid-template-columns:1fr}.hero input,.hero button{width:100%}.task-list>div{grid-template-columns:10px minmax(0,1fr) auto;padding:12px 4px}.task-list small,.task-list em{display:none}.task-list form{grid-column:3}.assignment{grid-template-columns:32px minmax(0,1fr);padding:13px}.assignment em{display:none}.day-head{padding:15px}.table-wrap{margin:0 -17px;padding:0 17px}.section-title{align-items:end;gap:10px}.section-title>span{max-width:120px;text-align:right}input,select{min-width:0;font-size:16px}}
@media(min-width:1500px){main{padding-left:5vw;padding-right:5vw}.schedule-grid{gap:22px}.panel{padding:28px}}
.user-menu{display:flex;align-items:center;gap:14px;text-align:right}.user-menu div{display:grid}.user-menu b{font-size:13px}.user-menu span{font-size:10px;color:var(--muted)}.user-menu a{color:var(--orange);font-size:11px;text-decoration:none;border:1px solid #f4c8a9;padding:7px 10px;border-radius:7px}.user-welcome{display:flex;justify-content:space-between;align-items:center;border-left:5px solid var(--blue)}.user-welcome>span{font-size:12px;color:var(--muted)}.user-welcome div{display:grid;text-align:right}.user-welcome small{color:var(--muted)}
.login-page{display:block;min-height:100vh;background:linear-gradient(120deg,var(--blue-dark) 0 45%,var(--paper) 45%)}.login-shell{min-height:100vh;max-width:1100px;margin:auto;padding:7vh 5%;display:grid;grid-template-columns:1fr 430px;align-items:center;gap:8vw}.login-brand{color:#fff}.login-brand>span{display:grid;place-items:center;width:58px;height:58px;background:var(--orange);border-radius:16px;font-weight:700;font-size:22px;margin-bottom:55px}.login-brand p{font-size:10px;letter-spacing:2px;color:#b9d8f4}.login-brand h1{font-size:42px;line-height:1.3;margin:10px 0 20px}.login-brand small{display:block;max-width:390px;color:#c9ddf2;line-height:1.8}.login-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:40px;box-shadow:0 25px 60px rgba(11,49,95,.15)}.login-card>div>p:last-child{font-size:12px;color:var(--muted);margin:5px 0 24px}.login-card form{display:grid;gap:15px}.login-card input,.login-card button{width:100%}.login-hint{display:block;text-align:center;color:var(--muted);font-size:10px;margin-top:20px}
@media(max-width:750px){.login-page{background:var(--paper)}.login-shell{display:block;padding:25px 16px}.login-brand{color:var(--ink);text-align:center}.login-brand>span{margin:10px auto 15px;width:48px;height:48px}.login-brand p,.login-brand small{display:none}.login-brand h1{font-size:24px;margin:0 0 20px}.login-card{max-width:430px;margin:auto;padding:25px}.user-menu span{display:none}.user-menu{gap:7px}.user-menu a{padding:6px}}
.auto-status{display:inline-flex;margin-top:12px;padding:4px 9px;border-radius:20px;font-size:10px;font-weight:700}.auto-status.on{color:#0b5b3c;background:#dff5eb}.auto-status.off{color:#69778a;background:#e9eef4}.auto-toggle{height:40px;padding:0 15px;border-radius:7px;color:var(--blue);background:#e6f2fc;border:1px solid #b9d8f4;font-weight:600;white-space:nowrap}.auto-toggle.enabled{color:#a7470b;background:#fff0e5;border-color:#f4c8a9}
.day-card.day-1 .day-head{background:#fff8cf;border-top-color:#f2c94c}.day-card.day-1 .day-head small{color:#8a6810}.day-card.day-2 .day-head{background:#ffe8f2;border-top-color:#ef7eae}.day-card.day-2 .day-head small{color:#a83e6b}.day-card.day-3 .day-head{background:#e4f6e8;border-top-color:#55ad68}.day-card.day-3 .day-head small{color:#28723a}
.nav-group{display:grid;gap:6px}.nav-title{padding:0 12px 7px;color:#9fc4e5;font-size:9px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}.nav-group a{display:flex;align-items:center;gap:10px}.nav-group a>i{width:20px;font-style:normal;text-align:center}.nav-group a>span{display:grid}.nav-group a small{font-size:9px;color:#a9c9e5;font-weight:400}.nav-divider{height:1px;background:rgba(255,255,255,.2);margin:17px 8px}.admin-group{background:rgba(7,35,68,.22);padding:12px 7px;border-radius:11px}.admin-group .nav-title{color:#ffbd8c}.admin-group a.active{border-left-color:var(--orange);background:rgba(244,123,32,.18)}.role-badge{font-size:9px;font-weight:700;letter-spacing:1px;padding:4px 7px;border-radius:5px}.role-badge.admin{color:#a7470b;background:#fff0e5}.role-badge.user{color:var(--blue-dark);background:#e6f2fc}
.task-en{display:block;color:#72829a!important;font-size:10px!important;font-weight:400;margin-top:2px}.task-form{grid-template-columns:1.5fr 1.5fr 1fr .8fr .6fr auto}
aside{overflow-y:auto}nav{margin-top:38px}.admin-group{gap:4px}.admin-group a{padding:9px 10px}.admin-group a small{line-height:1.3}.admin-group .nav-title{padding-bottom:5px}
@media(max-height:700px) and (min-width:901px){.side-note{display:none}nav{margin-top:25px}}
@media(max-width:900px) and (min-width:601px){aside{overflow:visible}.nav-title,.nav-group a small{display:none}.nav-group,.admin-group{display:flex;align-items:center;padding:0;background:transparent}.nav-divider{width:1px;height:30px;margin:0 8px}.nav-group a{white-space:nowrap}.admin-group a{padding:8px}.admin-group a.active{border-left:0;border-bottom:2px solid var(--orange)}}
@media(max-width:1180px){.task-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.task-form{grid-template-columns:1fr}}
.dt-container{font-family:inherit;color:var(--ink);font-size:13px}.dt-container .dt-layout-row:first-child{background:#f5f8fc;border:1px solid var(--line);border-radius:11px 11px 0 0;padding:12px 14px;margin:20px 0 0}.dt-container .dt-layout-row:last-child{border-top:1px solid var(--line);padding:14px 4px 2px;margin:0}.dt-container .dt-length,.dt-container .dt-search{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.dt-container .dt-search:before{content:'⌕';font-size:19px;color:var(--blue);margin-right:-35px;z-index:1}.dt-container .dt-search input{width:240px!important;padding:0 12px 0 34px!important}.dt-container .dt-search input,.dt-container .dt-length select{height:38px;border:1px solid #cbd9e7!important;border-radius:8px!important;background:#fff!important;color:var(--ink);font-family:inherit;box-shadow:0 1px 3px rgba(20,93,160,.04)}.dt-container .dt-search input:focus,.dt-container .dt-length select:focus{outline:2px solid #c7e1f7!important;border-color:var(--blue)!important}.dt-container .dt-length select{min-width:64px;padding:0 25px 0 10px!important}.dt-container table.dataTable{margin:0!important;border:1px solid var(--line)!important;border-top:0!important;border-radius:0 0 10px 10px;overflow:hidden}.dt-container table.dataTable thead th{background:var(--blue-dark)!important;color:#fff!important;border:0!important;padding:13px 14px!important;font-size:10px;letter-spacing:.5px;white-space:nowrap}.dt-container table.dataTable thead th:first-child{border-radius:0}.dt-container table.dataTable tbody td{padding:13px 14px!important;border-bottom:1px solid #e9eff5!important;background:#fff;vertical-align:middle}.dt-container table.dataTable tbody tr:nth-child(even) td{background:#f9fbfd}.dt-container table.dataTable tbody tr:hover td{background:#edf6ff!important}.dt-container table.dataTable tbody tr:last-child td{border-bottom:0!important}.dt-container .dt-info{color:var(--muted);font-size:11px}.dt-container .dt-paging{display:flex;gap:4px}.dt-container .dt-paging .dt-paging-button{min-width:34px;height:34px;padding:5px 9px!important;border:1px solid var(--line)!important;border-radius:7px!important;background:#fff!important;color:var(--ink)!important;font:500 12px 'IBM Plex Sans Thai',sans-serif!important}.dt-container .dt-paging .dt-paging-button:hover{background:#eaf4fd!important;color:var(--blue)!important;border-color:#afd1ee!important}.dt-container .dt-paging .dt-paging-button.current,.dt-container .dt-paging .dt-paging-button.current:hover{background:var(--blue)!important;color:#fff!important;border-color:var(--blue)!important;box-shadow:0 3px 8px rgba(20,93,160,.22)}.dt-container .dt-paging .dt-paging-button.disabled{opacity:.38!important}.task-table{margin-top:22px}.task-table td:first-child{display:table-cell}.task-table .delete{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;color:#c8513d;background:#fff0ed}.task-table .delete:hover{background:#ffe1da}.dt-empty{text-align:center!important;color:var(--muted)!important;padding:35px!important}@media(max-width:600px){.dt-container .dt-layout-row{display:grid!important;grid-template-columns:1fr;gap:10px}.dt-container .dt-layout-cell{text-align:left!important}.dt-container .dt-search,.dt-container .dt-search input{width:100%!important}.dt-container .dt-layout-row:last-child{justify-items:center}.dt-container .dt-info{text-align:center}.dt-container table.dataTable thead th,.dt-container table.dataTable tbody td{padding:11px 10px!important}}
