@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@400;500;600;700;800&display=swap');
:root{font-family:'Sarabun',Tahoma,sans-serif!important;background:#f3f7fc!important;color:#142b50}body,button,input,select,textarea{font-family:'Sarabun',Tahoma,sans-serif!important}
aside{background:linear-gradient(165deg,#0a1b35,#122b4b);padding:17px 13px;width:255px}
aside h2{font-size:19px;font-weight:800;margin:4px 8px 22px;letter-spacing:-.4px;display:flex;align-items:center;gap:9px}
aside h2 .brand-sw{color:#ff8127;font-size:30px;letter-spacing:-2px}
aside h2 .brand-txt{font-size:14px;line-height:1.15}
aside h2 .brand-txt small{font-size:10px;display:block;color:#a8bdd5;font-weight:400;margin-top:5px}
aside a{display:flex;align-items:center;gap:13px;padding:12px 13px;font-size:14px;font-weight:500;color:#d3e0f3;margin:3px 0;border-radius:9px}
aside a svg{width:18px;height:18px;stroke-width:1.9;flex-shrink:0}
aside a.active{background:#1459a2;border-left:3px solid #34a5ff;padding-left:10px}
aside .side-sep{font-size:11px;letter-spacing:1px;color:#7591b0;margin:21px 12px 8px}
main{margin-left:255px;padding:23px 25px;max-width:none}
.top{background:#fff;border:1px solid #e9eef6;border-radius:13px;padding:13px 19px;margin-bottom:19px;box-shadow:0 2px 12px #12365b05}
.top h1{font-size:21px}.top .sub{font-size:12px}
.card,.panel{border-color:#e7edf6;box-shadow:0 4px 18px #14365607}
.dash-welcome{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:15px 0 21px}.dash-welcome .eyebrow{font-size:11px;letter-spacing:1.8px;color:#8a9bb4;font-weight:700}.dash-welcome h2{font-size:28px;margin:4px 0 1px}.hand{font-size:18px;color:#fa8a2e}.dash-welcome p{font-size:13px;color:#8494ab;margin:0}.main-action{display:flex;align-items:center;gap:7px}
.dash-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.stat-box{border:1px solid #e7edf7;border-radius:14px;background:#fff;padding:18px;display:flex;align-items:center;gap:13px;min-width:0;box-shadow:0 4px 18px #17365a08}.stat-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:13px;flex-shrink:0}.stat-icon svg{width:27px;height:27px}.blue{color:#126bdb;background:#e5f0ff}.green{color:#0ba67b;background:#e1f8ed}.orange{color:#f47721;background:#fff0e4}.purple{color:#8356e8;background:#f0eaff}.stat-box div{min-width:0;flex:1}.stat-box small{display:block;color:#536d90;font-size:12px;white-space:nowrap}.stat-box strong{display:block;font-size:27px;line-height:1.3;color:#152e53}.stat-box em{display:block;font-style:normal;font-size:11px;color:#23a074;white-space:nowrap}.stat-box .arrow{width:14px;color:#8a9ab0}
.dash-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,.9fr);gap:14px;margin-top:15px}.dash-panel{background:#fff;border:1px solid #e7edf6;border-radius:14px;box-shadow:0 4px 18px #17365a06;min-width:0;overflow:hidden}.panel-title{padding:17px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #edf1f7}.panel-title h3{margin:0;font-size:16px;display:flex;align-items:center;gap:9px}.panel-title h3 svg{width:19px;height:19px;color:#147ce4}.panel-title>a{display:flex;align-items:center;gap:4px;font-size:12px;color:#1670da;font-weight:600}.panel-title>a svg{width:13px}.dash-table-wrap{overflow-x:auto}.dash-table{width:100%;border-collapse:collapse}.dash-table th{background:#f8faff;color:#7586a2;font-size:11px;padding:12px;white-space:nowrap}.dash-table td{padding:12px;font-size:12px;white-space:nowrap}.proj-name{display:flex;align-items:center;gap:9px}.proj-name b,.proj-name small{display:block}.proj-name b{font-size:12px}.proj-name small{font-size:10px;color:#8492a7;margin-top:3px}.mini-building{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;background:#e8f1ff;color:#236ed4}.mini-building svg{width:20px}.status-pill{border-radius:7px;padding:5px 8px;font-size:11px}.status-pill.running{background:#def8ea;color:#129463}.status-pill.done{background:#e2efff;color:#1665bb}.status-pill.draft{background:#fff1df;color:#ba7515}.round-link{border:1px solid #e1e8f2;width:28px;height:28px;display:grid;place-items:center;border-radius:8px}.round-link svg{width:14px}.dash-empty{padding:30px!important;text-align:center!important;color:#7e91a9}.dash-empty a{color:#1767de}.panel-desc{padding:8px 18px;font-size:12px;color:#8798ae;margin:0}.ring-holder{display:grid;place-items:center;padding:12px 0}.donut{width:175px;height:175px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#1dbd93 0 var(--complete),#1873eb var(--complete) calc(var(--complete) + var(--active)),#e5ebf4 calc(var(--complete) + var(--active)) 100%);position:relative}.donut:before{content:'';position:absolute;inset:29px;background:white;border-radius:50%}.donut span{position:relative;text-align:center}.donut b{font-size:32px;display:block}.donut small{color:#8b98a9;font-size:12px}.legend-row{display:flex;justify-content:space-between;padding:8px 20px;font-size:12px}.legend-row:last-child{padding-bottom:22px}.legend-row span{display:flex;align-items:center;gap:8px}.dot{width:9px;height:9px;display:inline-block;border-radius:50%}.draftdot{background:#e5ebf4}.activedot{background:#1873eb}.completedot{background:#1dbd93}
.dash-bottom{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr) minmax(260px,1fr);gap:14px;margin-top:15px}.feature-art{margin:13px;position:relative;border-radius:10px;overflow:hidden;background:linear-gradient(150deg,#122e53,#0d5d9c);min-height:245px}.blueprint-bg{height:245px;position:relative;display:grid;place-items:center;background-image:linear-gradient(#ffffff13 1px,transparent 1px),linear-gradient(90deg,#ffffff13 1px,transparent 1px);background-size:24px 24px}.house-art{width:170px;height:170px;color:#bce2ff;stroke-width:.9;filter:drop-shadow(0 9px 15px #0007)}.zap-art{position:absolute;right:25%;top:24%;width:42px;color:#ffae43}.beam{position:absolute;border:2px solid transparent;border-radius:10px}.beam-a{width:54%;height:55%;border-color:#fc7a3c88;transform:rotate(-15deg)}.beam-b{width:30%;height:43%;border-color:#50a8ff99;transform:rotate(26deg)}.feature-caption{position:absolute;inset:auto 0 0;background:linear-gradient(transparent,#071a35ef);padding:40px 18px 17px;color:#fff;display:flex;flex-direction:column}.feature-caption b{font-size:17px}.feature-caption span{font-size:12px;color:#d9e9ff}.feature-caption a{display:flex;align-items:center;gap:5px;color:#fff;font-size:12px;margin-top:12px;font-weight:700}.feature-caption a svg{width:14px}.task-item,.activity-item{display:flex;gap:10px;align-items:center;padding:14px;border-bottom:1px solid #f0f3f9}.task-item>span:nth-child(2),.activity-item>span:nth-child(2){flex:1;min-width:0}.task-item b,.activity-item b{font-size:12px;display:block}.task-item small,.activity-item small{font-size:11px;color:#8998ad;display:block;margin-top:4px}.task-item>svg{width:15px;color:#9baac1}.task-icon{width:35px;height:35px;border-radius:9px;display:grid;place-items:center;flex-shrink:0}.task-icon svg{width:19px;height:19px}.activity-item time{font-size:10px;color:#8c9ab0;white-space:nowrap}
@media(max-width:1250px){.dash-stats{grid-template-columns:repeat(2,1fr)}.dash-layout{grid-template-columns:1fr}.dash-bottom{grid-template-columns:1fr 1fr}.activity-panel{grid-column:1/-1}}@media(max-width:900px){aside{width:100%;position:static}.dash-bottom{grid-template-columns:1fr}.activity-panel{grid-column:auto}main{margin-left:0}.dash-welcome{flex-wrap:wrap}}@media(max-width:550px){.dash-stats{grid-template-columns:1fr}.dash-welcome h2{font-size:24px}}