@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@400;500;600;700&family=Sarabun:wght@400;500;600;700&display=swap";
:root{--navy:#02234e;--navy-2:#02305e;--ink:#152238;--muted:#718096;--canvas:#f5f5f7;--line:#e5e9f0;--blue:#2f80ed;--green:#1f9d72;--orange:#db8a24;--red:#d95050}*{box-sizing:border-box}html,body{height:100%;min-height:100%;overflow:hidden}body{color:var(--ink);background:var(--canvas);letter-spacing:.01em;margin:0;font-family:Manrope,Sarabun,sans-serif;font-size:13.5px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}.login-shell{background:radial-gradient(circle at 12% 12%,#194f88 0,#092c58 38%,#01172f 100%);place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:#fffffff7;border-radius:14px;width:min(100%,430px);padding:38px;box-shadow:0 22px 60px #00132c5c}.brand-mark,.brand-small{background:var(--navy);color:#fff;place-items:center;font-family:Inter,sans-serif;font-weight:700;display:inline-grid}.brand-mark{border-radius:11px;width:42px;height:42px;margin-bottom:20px;font-size:24px}.brand-small{border-radius:7px;width:28px;height:28px;margin-right:9px}.eyebrow{color:#6880a2;letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;font-family:Inter,sans-serif;font-size:11px;font-weight:700}h1,h2,h3,p{margin-top:0}h1{letter-spacing:-.025em;margin-bottom:8px;font-size:27px}h2{margin-bottom:4px;font-size:17px}h3{margin-bottom:10px;font-size:13px}.muted{color:var(--muted)}.small{font-size:11px}.login-copy{margin-bottom:24px;line-height:1.6}.login-form{gap:15px;display:grid}label{color:#45546a;gap:6px;font-size:12px;font-weight:700;display:grid}input{border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:6px;outline:none;padding:10px 12px;transition:border-color .18s,box-shadow .18s}input:focus{border-color:#91a6c6;box-shadow:0 0 0 3px #2f80ed1f}.primary-button,.secondary-button{border:0;border-radius:6px;padding:10px 15px;font-family:Inter,sans-serif;font-size:12px;font-weight:600;transition:transform .15s,background .15s}.primary-button{background:var(--navy);color:#fff}.primary-button:hover{background:#011a3c;transform:translateY(-1px)}.secondary-button{color:var(--navy);background:#fff;border:1px solid #ccd5e1}.secondary-button:hover{background:#f6f9fc}.login-button{width:100%;margin-top:3px;padding:12px}.alert{border-radius:6px;padding:10px 12px;line-height:1.5}.alert-error{color:#a42c2c;background:#fff2f2;border:1px solid #f0c3c3}.security-note{color:#8592a5;margin:21px 0 0;font-size:11px;line-height:1.55}.security-note span{color:var(--green)}.app-shell{background:var(--canvas);height:100vh;min-height:0;overflow:hidden}.topbar{background:var(--navy);color:#fff;justify-content:space-between;align-items:center;height:52px;padding:0 20px;display:flex;box-shadow:0 2px 4px -1px #00000040,0 4px 5px #00000029}.topbar-brand{letter-spacing:.02em;align-items:center;font-family:Inter,sans-serif;font-size:13px;display:flex}.topbar-brand b{font-weight:700}.topbar-actions{align-items:center;gap:10px;font-size:12px;display:flex}.connection-dot{background:#5dd69b;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #5dd69b26}.link-button{color:#b8cae2;background:0 0;border:0;padding:3px 0 3px 10px;font-size:11px}.link-button:hover{color:#fff}.workspace{height:calc(100vh - 52px);min-height:0;display:flex;overflow:hidden}.sidebar{background:var(--navy);color:#c8d4e8;flex-direction:column;flex:0 0 218px;width:218px;height:100%;padding:22px 11px 16px;display:flex;overflow-y:auto}.sidebar-user{color:#fff;align-items:center;gap:10px;padding:0 10px 23px;display:flex}.avatar{color:#fff;background:#174b83;border:1px solid #fff3;border-radius:50%;place-items:center;width:34px;height:34px;font-family:Inter,sans-serif;font-weight:700;display:grid}.sidebar-user strong,.sidebar-user small{display:block}.sidebar-user strong{text-overflow:ellipsis;white-space:nowrap;max-width:132px;font-size:12px;overflow:hidden}.sidebar-user small{color:#9fb2cc;margin-top:3px;font-size:10px}.sidebar-section{color:#7693b9;letter-spacing:.09em;padding:0 10px 8px;font-family:Inter,sans-serif;font-size:10px;font-weight:700}.side-nav{color:#c8d4e8;text-align:left;background:0 0;border:0;border-radius:5px;align-items:center;gap:10px;width:100%;margin:2px 0;padding:10px;font-size:12px;display:flex}.side-nav span{color:#94b6df;text-align:center;width:18px;font-size:16px}.side-nav:hover,.side-nav.is-active{color:#fff;background:#ffffff17}.side-nav.is-active{box-shadow:inset 3px 0 #73adf3}.sidebar-foot{color:#91a8c5;border-top:1px solid #ffffff1a;margin-top:auto;padding:14px 10px 0;font-size:10px;line-height:1.7}.sidebar-foot span{color:#617c9e}.main-content{flex-direction:column;flex:1;min-width:0;height:100%;min-height:0;padding:30px;display:flex;overflow:hidden}.page-heading{grid-template-columns:minmax(185px,220px) minmax(0,1fr) auto;align-items:start;gap:20px;margin-bottom:14px;display:grid}.page-heading-copy{min-width:0;padding-top:2px}.page-heading h1{font-size:25px}.page-heading p:last-child{margin-bottom:0}.page-alert{margin-bottom:18px}.summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px;display:grid}.summary-inline{min-width:0;margin-bottom:0}.summary-card{border:1px solid var(--line);border-top:3px solid var(--navy);background:#fff;border-radius:7px;min-height:94px;padding:11px 16px;box-shadow:0 1px 2px #1124400a}.summary-blue{border-top-color:var(--blue)}.summary-green{border-top-color:var(--green)}.summary-orange{border-top-color:var(--orange)}.summary-label{color:#66758a;font-size:11px}.summary-value{color:var(--navy);letter-spacing:-.04em;margin:5px 0 1px;font-family:Inter,sans-serif;font-size:26px;font-weight:700}.summary-hint{color:#9aa7b8;font-size:10px}.content-panel{border:1px solid var(--line);background:#fff;border-radius:7px;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden;box-shadow:0 1px 2px #1124400a}.panel-toolbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:20px;padding:16px 18px;display:flex}.panel-heading-block{min-width:155px}.panel-heading-block h2{margin-bottom:3px}.panel-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:7px;display:flex}.view-switcher{background:#fff;border:1px solid #d8e0eb;border-radius:6px;display:flex;overflow:hidden}.view-switcher button{color:#6b7b90;white-space:nowrap;background:#fff;border:0;padding:8px 10px;font-size:11px}.view-switcher button+button{border-left:1px solid #d8e0eb}.view-switcher button.is-selected{color:var(--navy);background:#eaf2fb;font-weight:700}.month-select,.task-search-select{height:34px;color:var(--navy);background:#fff;border:1px solid #ccd5e1;border-radius:6px;padding:0 8px;font-size:11px}.task-search-select{max-width:230px}.export-button{white-space:nowrap}.search-form{gap:7px;width:min(390px,48%);display:flex}.search-form input{height:34px;padding:8px 10px;font-size:12px}.search-form input:disabled{color:#748196;background:#f2f5f8}.search-form .primary-button{padding:8px 13px}.search-note{color:#5c7290;background:#f6faff;border-bottom:1px solid #e7eef7;padding:8px 18px;font-size:11px}.table-wrap{max-height:calc(100vh - 310px);overflow:auto}.table-wrap table{border-collapse:collapse;width:100%;min-width:800px}.table-wrap th{z-index:2;background:var(--navy-2);color:#fff;text-align:left;white-space:nowrap;padding:10px 12px;font-family:Inter,sans-serif;font-size:11px;font-weight:500;position:sticky;top:0}.table-wrap td{border-bottom:1px solid #eff2f5;height:56px;padding:9px 12px;font-size:12px}.table-wrap tbody tr{cursor:pointer}.table-wrap tbody tr:hover td,.table-wrap tbody tr.row-selected td{background:#edf5fd}.task-table-wrap table{min-width:1650px}.case-number{color:#1c68ba;white-space:nowrap;font-family:Inter,sans-serif;font-weight:700}.subject{text-overflow:ellipsis;white-space:nowrap;color:#26374e;max-width:340px;font-weight:600;overflow:hidden}.task-subject{max-width:300px}.task-text{white-space:normal;min-width:260px;max-width:420px;line-height:1.45}.month-group-row td{height:auto;color:var(--navy);background:#eaf2fb;border-top:1px solid #cddded;padding:8px 12px;font-weight:700}.month-group-row span{float:right;color:#6b85a5;font-size:10px;font-weight:600}.month-cell{color:#5f7899;white-space:nowrap}.status-pill{white-space:nowrap;border-radius:999px;align-items:center;padding:4px 8px;font-size:10px;font-weight:700;display:inline-flex}.status-warning{color:#a66912;background:#fff3da}.status-success{color:#167450;background:#e0f6ed}.status-danger{color:#ae3c3c;background:#ffebeb}.status-info{color:#2566a8;background:#e5f1ff}.missing-prod{color:#b04b2f;font-weight:700}.overdue{color:#c23e3e;font-weight:700}.empty-cell{color:#8896a8;text-align:center;padding:40px!important}.warning-note{color:#986b18;background:#fff8e6}.detail-drawer{border-left:1px solid var(--line);background:#fff;flex-direction:column;flex:0 0 370px;width:370px;height:100%;min-height:0;display:flex;overflow:hidden;box-shadow:-4px 0 14px #0c25450d}.drawer-head{border-bottom:1px solid var(--line);flex:none;justify-content:space-between;align-items:flex-start;padding:25px 22px 18px;display:flex}.drawer-head h2{color:var(--navy);margin:0;font-family:Inter,sans-serif}.icon-button{color:#7c899b;background:0 0;border:0;font-size:24px;line-height:1}.drawer-body{flex:1;min-height:0;padding:20px 22px;overflow-y:auto}.drawer-loading{color:#8190a4;padding:30px 22px}.detail-title{color:#24344b;margin-bottom:10px;font-size:15px;font-weight:700;line-height:1.5}.detail-meta{color:#7b899b;align-items:center;gap:8px;margin-bottom:23px;font-size:11px;display:flex}.detail-block{margin-bottom:23px}.task-item,.comment-item{background:#fbfcfd;border:1px solid #edf0f4;border-radius:5px;margin-bottom:8px;padding:11px}.task-top{color:var(--navy);justify-content:space-between;gap:10px;font-size:11px;display:flex}.task-top span{color:#77879b}.task-item p,.comment-item p{color:#55667b;margin:7px 0;font-size:11px;line-height:1.55}.task-item small,.comment-item small{color:#9aa6b5;font-size:10px}.case-link{color:#236bb4;margin-top:4px;font-size:11px;font-weight:700;text-decoration:none;display:inline-block}.case-link:hover{text-decoration:underline}@media (max-width:1120px){.page-heading{grid-template-columns:minmax(0,1fr) auto}.page-heading-copy{grid-column:1/-1}.summary-inline{grid-column:1;width:100%}.page-heading>.secondary-button{grid-area:2/2}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-drawer{z-index:5;max-width:min(370px,92vw);position:fixed;inset:52px 0 0 auto}.panel-toolbar{flex-direction:column;align-items:stretch;gap:12px}.panel-actions{justify-content:flex-start}.search-form{width:min(100%,390px)}}@media (max-width:760px){.topbar{padding:0 13px}.topbar-brand{font-size:11px}.topbar-actions{font-size:0}.topbar-actions .link-button{font-size:11px}.sidebar{flex-basis:55px;width:55px;padding:14px 6px}.sidebar-user{justify-content:center;padding:0 0 20px}.sidebar-user>div:not(.avatar),.sidebar-section,.side-nav:not(.is-active) span,.side-nav:not(.is-active){font-size:0}.sidebar-user .avatar{width:32px;height:32px}.side-nav{justify-content:center;padding:10px 4px}.side-nav span{font-size:16px}.sidebar-foot{display:none}.main-content{padding:20px 12px}.page-heading{flex-direction:column;align-items:stretch;gap:12px;display:flex}.page-heading h1{font-size:21px}.summary-grid{gap:8px}.summary-inline{width:100%}.summary-card{min-height:88px;padding:11px}.summary-value{margin-top:5px;font-size:25px}.panel-actions{flex-direction:column;align-items:stretch}.view-switcher,.search-form,.month-select,.task-search-select,.export-button{width:100%;max-width:none}.view-switcher button{flex:1}.search-form{width:100%}.table-wrap th,.table-wrap td{padding-left:9px;padding-right:9px}.login-card{padding:28px 22px}}.content-panel>.table-wrap{flex:1;min-height:0;max-height:none}
