:root{
  --maroon:#6f1021;--maroon-2:#8d1a30;--maroon-3:#4b0915;--brick:#8d2634;
  --gold:#d99a22;--gold-2:#f0c86e;--concrete:#f3efe8;--concrete-2:#e7e1d8;
  --ink:#201d1c;--muted:#6d6864;--line:#d8d0c6;--white:#fff;--green:#2d7d4a;
  --red:#b4232d;--amber:#b87315;--blue:#2f6294;--shadow:0 10px 30px rgba(44,25,25,.12);
  --r:18px;--safe-bottom:max(14px,env(safe-area-inset-bottom));
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#e7e1d8;color:var(--ink);font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.root{min-height:100vh}.hidden{display:none!important}
body::before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(255,255,255,.56),rgba(255,255,255,.64)),url('assets/construction-skyline.svg') bottom center/cover no-repeat;z-index:-2}body::after{content:"";position:fixed;inset:0;background-image:linear-gradient(90deg,rgba(90,70,60,.035) 1px,transparent 1px),linear-gradient(rgba(90,70,60,.035) 1px,transparent 1px);background-size:32px 32px;z-index:-1}
/* Login */
.login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(rgba(245,241,234,.74),rgba(245,241,234,.88)),url('assets/construction-skyline.svg') bottom center/1150px auto no-repeat}.login-panel{width:min(460px,100%);background:rgba(255,255,255,.94);border:1px solid rgba(111,16,33,.13);border-radius:28px;box-shadow:0 28px 70px rgba(60,26,29,.18);overflow:hidden}.login-hero{padding:26px 28px 19px;text-align:center;background:linear-gradient(145deg,#fff,#f7f0e6);border-bottom:4px solid var(--gold);position:relative}.login-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:48%;background:url('assets/construction-skyline.svg') bottom center/760px auto no-repeat;opacity:.24;pointer-events:none}.logo-large{width:155px;height:155px;border-radius:30px;object-fit:cover;position:relative;z-index:1;filter:drop-shadow(0 10px 10px rgba(70,24,30,.18))}.brand-name{font-size:2.5rem;letter-spacing:.09em;font-weight:900;color:var(--maroon);margin:8px 0 3px;position:relative;z-index:1}.tagline{font-size:.83rem;text-transform:uppercase;letter-spacing:.12em;color:#7c4a30;font-weight:800;position:relative;z-index:1}.login-body{padding:24px}.field{display:grid;gap:7px;margin-bottom:14px}.field label{font-weight:800;color:#352c28}.field input,.field select,.field textarea{width:100%;border:1px solid #cfc7bd;border-radius:13px;padding:13px 14px;background:#fff;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,154,34,.2)}.btn{border:0;border-radius:13px;padding:12px 16px;font-weight:850;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn.primary{background:linear-gradient(135deg,var(--maroon),var(--maroon-2));color:#fff;border:1px solid var(--gold);box-shadow:0 7px 14px rgba(111,16,33,.2)}.btn.secondary{background:#f5ecee;color:var(--maroon);border:1px solid #e0c8ce}.btn.gold{background:linear-gradient(135deg,#d68b14,var(--gold-2));color:#382407}.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn.danger{background:#fff0f0;color:#a91b27;border:1px solid #e6b8bd}.btn.full{width:100%}.btn.small{padding:8px 11px;font-size:.82rem}.btn:disabled{opacity:.45;cursor:not-allowed}.quick-login{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:16px}.quick-login button{border:1px solid #d9c9c9;background:#fff;border-radius:11px;padding:9px 7px;font-size:.77rem;font-weight:750;color:var(--maroon)}.login-note{font-size:.78rem;color:var(--muted);line-height:1.45;margin:14px 0 0;background:#fff8df;border:1px solid #efdca6;padding:10px;border-radius:11px}
/* App shell */
.app{min-height:100vh;padding-bottom:82px}.app-header{position:sticky;top:0;z-index:40;background:rgba(247,244,239,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 4px 16px rgba(48,29,26,.08)}.header-top{height:76px;display:flex;align-items:center;padding:8px 16px;gap:12px;max-width:1300px;margin:auto}.brand-mini{display:flex;align-items:center;gap:10px;min-width:0}.brand-mini img{width:56px;height:56px;border-radius:14px;object-fit:cover}.brand-mini strong{display:block;font-size:1.35rem;color:var(--maroon);letter-spacing:.08em}.brand-mini small{display:block;color:#80583e;font-size:.72rem;font-weight:700}.header-spacer{flex:1}.icon-button{width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;font-size:1.15rem;position:relative}.badge{position:absolute;right:-4px;top:-5px;background:#d12c38;color:#fff;border-radius:20px;font-size:.64rem;font-weight:900;padding:2px 6px}.context-strip{background:linear-gradient(90deg,var(--maroon-3),var(--maroon));color:#fff;padding:8px 16px;font-size:.78rem}.context-strip .inner{max-width:1300px;margin:auto;display:flex;gap:14px;align-items:center;justify-content:space-between}.context-strip strong{color:#ffd479}.page{max-width:1300px;margin:auto;padding:18px 14px 24px}.page-title{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}.page-title .grow{flex:1}.page-title h1{margin:0;color:#3a151a;font-size:1.62rem}.page-title p{margin:5px 0 0;color:var(--muted);line-height:1.4}.section-title{display:flex;align-items:center;gap:9px;margin:20px 0 11px;color:#44131a}.section-title h2{font-size:1.08rem;margin:0}.section-title::after{content:"";height:1px;background:linear-gradient(90deg,var(--gold),transparent);flex:1}.construction-hero{background:linear-gradient(135deg,rgba(92,9,25,.98),rgba(132,30,48,.94)),url('assets/construction-skyline.svg') right bottom/620px auto no-repeat;color:#fff;border:1px solid #bc7621;border-radius:22px;padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden}.construction-hero::after{content:"";position:absolute;right:-20px;bottom:-35px;width:240px;height:165px;background:linear-gradient(transparent,rgba(255,255,255,.06)),repeating-linear-gradient(0deg,transparent 0 25px,rgba(255,255,255,.09) 26px 28px),repeating-linear-gradient(90deg,transparent 0 52px,rgba(255,255,255,.09) 53px 55px);transform:skewY(-4deg)}.construction-hero h2{margin:0 0 6px;font-size:1.5rem;position:relative;z-index:1}.construction-hero p{margin:0;opacity:.84;position:relative;z-index:1}.hero-stat{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;position:relative;z-index:1}.hero-stat div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:13px;padding:10px 13px}.hero-stat strong{display:block;color:#ffd479;font-size:1.35rem}.grid{display:grid;gap:13px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:0 5px 14px rgba(45,29,25,.055)}.card.click{cursor:pointer;transition:.18s}.card.click:active{transform:scale(.985)}.module{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center}.module-icon{width:48px;height:48px;border-radius:14px;background:linear-gradient(145deg,#7e1026,#9e283d);color:#ffd36f;display:grid;place-items:center;font-size:1.5rem;box-shadow:inset 0 0 0 1px rgba(255,211,111,.36)}.module h3{margin:0 0 5px;color:#4b101a;font-size:1rem}.module p{margin:0;color:var(--muted);font-size:.81rem;line-height:1.35}.arrow{color:#a56317;font-size:1.35rem}.kpi{position:relative;overflow:hidden}.kpi::after{content:"";position:absolute;right:-15px;bottom:-20px;width:74px;height:74px;border:10px solid rgba(111,16,33,.05);border-radius:50%}.kpi small{color:var(--muted);display:block}.kpi strong{display:block;color:var(--maroon);font-size:1.7rem;margin-top:8px}.kpi .trend{font-size:.72rem;color:var(--green);font-weight:800;margin-top:6px}.status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:.7rem;font-weight:900;background:#ebe8e3;color:#555}.status.green{background:#e4f3e8;color:#25653b}.status.red{background:#fde5e7;color:#a61f2b}.status.gold{background:#fff0ca;color:#81550b}.status.blue{background:#e6eef8;color:#2c5b91}.status.maroon{background:#f1dde2;color:#701123}.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:12px 0}.toolbar .spacer{flex:1}.segmented{display:flex;background:#e8e2da;border-radius:13px;padding:3px;overflow:auto}.segmented button{border:0;background:transparent;border-radius:10px;padding:9px 14px;white-space:nowrap;color:#4e4742}.segmented button.active{background:var(--maroon);color:#fff;box-shadow:0 3px 8px rgba(73,17,27,.2)}.tab-row{display:flex;overflow:auto;gap:7px;padding-bottom:3px}.tab-row button{border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px 13px;white-space:nowrap}.tab-row button.active{background:var(--maroon);color:#fff;border-color:var(--maroon)}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:50;background:linear-gradient(180deg,#7b1025,#510812);display:flex;justify-content:space-around;align-items:center;padding:8px 5px var(--safe-bottom);border-top:2px solid #c98d26;box-shadow:0 -8px 24px rgba(54,11,20,.2)}.bottom-nav button{border:0;background:transparent;color:#ead8dc;min-width:62px;padding:4px 7px;font-size:.67rem;display:grid;gap:4px;place-items:center}.bottom-nav button span:first-child{font-size:1.35rem}.bottom-nav button.active{color:#ffd66d;font-weight:900}.bottom-nav button.active::after{content:"";width:28px;height:3px;border-radius:3px;background:#ffd66d}
/* Tables and lists */
.list{display:grid;gap:9px}.list-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;gap:12px;align-items:center}.list-item .body{flex:1;min-width:0}.list-item h3{margin:0 0 5px;font-size:.94rem}.list-item p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.4}.list-item .meta{font-weight:850;color:var(--maroon)}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px;background:#fff}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top;font-size:.82rem}th{background:#f3ede6;color:#5f242c;text-transform:uppercase;font-size:.7rem;letter-spacing:.04em}.phone-cell{min-width:118px}.readonly{background:#f3f1ee;color:#89837d}.progress{height:9px;background:#e3dfda;border-radius:999px;overflow:hidden}.progress span{height:100%;display:block;border-radius:999px;background:linear-gradient(90deg,var(--maroon),var(--gold))}.metric{display:grid;grid-template-columns:120px 1fr 50px;gap:8px;align-items:center;font-size:.78rem;margin:9px 0}.metric strong{text-align:right}.chart-bars{display:flex;align-items:flex-end;gap:9px;height:155px;padding-top:10px;border-bottom:1px solid #d6cec5}.bar-group{flex:1;height:100%;text-align:center;font-size:.7rem;color:var(--muted);display:flex;flex-direction:column;justify-content:flex-end}.bar{width:70%;margin:auto;background:linear-gradient(180deg,#8f1830,#641021);border-radius:7px 7px 0 0;min-height:4px}.bar.gold{background:linear-gradient(180deg,#e6b54b,#c77f0f)}.donut{width:135px;height:135px;border-radius:50%;background:conic-gradient(var(--maroon) 0 38%,var(--gold) 38% 79%,#aaa39c 79% 100%);display:grid;place-items:center;margin:auto}.donut::after{content:attr(data-center);width:78px;height:78px;background:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900;color:var(--maroon);white-space:pre-line;text-align:center;font-size:.78rem}
/* Calendar */
.calendar{background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px}.calendar-head{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-weight:800;color:#635c57;font-size:.75rem}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr)}.day{min-height:58px;display:grid;place-items:center;position:relative;border-radius:12px;font-size:.84rem}.day.muted{color:#b1aaa4}.day.selected{background:var(--maroon);color:#fff;font-weight:900}.day.event-day::after{content:"";position:absolute;bottom:7px;width:5px;height:5px;border-radius:50%;background:var(--gold)}.day.conflict::after{background:#d12431}.schedule-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.conflict{background:#fff1f1;border:1px solid #e7aeb4;color:#8f1623;border-radius:13px;padding:12px}.approval-flow{display:flex;align-items:flex-start;overflow:auto;padding:7px 0}.flow-node{min-width:90px;text-align:center;font-size:.68rem;color:var(--muted);position:relative}.flow-node:not(:last-child)::after{content:"";position:absolute;top:16px;left:62%;width:75%;height:2px;background:#c9c2bc}.flow-dot{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;margin:0 auto 6px;background:#ddd7d0;color:#5c5550;font-weight:900;position:relative;z-index:1}.flow-node.done .flow-dot{background:var(--green);color:#fff}.flow-node.active .flow-dot{background:var(--gold);color:#3b2602}.flow-node.revise .flow-dot{background:#e27821;color:#fff}
/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.form-grid .span2{grid-column:span 2}.form-label{display:grid;gap:6px;font-size:.8rem;font-weight:800}.form-label input,.form-label select,.form-label textarea{border:1px solid #d1c8bf;border-radius:11px;padding:11px;background:#fff}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.notice{border:1px solid #efd59a;background:#fff7df;padding:12px;border-radius:13px;color:#6d5018;font-size:.82rem;line-height:1.45}.notice.red{border-color:#eab2b8;background:#fff0f1;color:#8c1d29}.notice.green{border-color:#b9ddc5;background:#edf9f1;color:#24613b}.settings-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.settings-row .body{flex:1}.settings-row h3{margin:0 0 4px;font-size:.92rem}.settings-row p{margin:0;color:var(--muted);font-size:.76rem}.switch{width:47px;height:27px;border-radius:99px;background:#bdb7b1;padding:3px;border:0}.switch span{display:block;width:21px;height:21px;border-radius:50%;background:#fff;transition:.2s}.switch.on{background:var(--green)}.switch.on span{transform:translateX(20px)}
/* Modal/toast */
.modal-backdrop{position:fixed;inset:0;background:rgba(29,16,17,.56);z-index:100;display:grid;place-items:end center;padding:18px}.modal{width:min(650px,100%);max-height:88vh;overflow:auto;background:#f7f3ed;border-radius:24px 24px 16px 16px;box-shadow:0 25px 70px rgba(0,0,0,.3);border:1px solid #cfc4ba}.modal-head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line);background:#fff}.modal-head h2{margin:0;flex:1;font-size:1.15rem;color:var(--maroon)}.modal-close{border:0;background:#eee9e3;width:36px;height:36px;border-radius:10px}.modal-body{padding:17px}.toast{position:fixed;left:14px;right:14px;bottom:92px;z-index:200;background:#241e1d;color:#fff;padding:12px 14px;border-radius:12px;box-shadow:var(--shadow);transform:translateY(140px);opacity:0;transition:.25s;text-align:center}.toast.show{transform:translateY(0);opacity:1}
.empty{text-align:center;padding:30px;color:var(--muted)}.muted{color:var(--muted)}.maroon{color:var(--maroon)}.gold-text{color:#a86e0b}.right{text-align:right}.small-text{font-size:.75rem}.brick-divider{height:8px;border-radius:5px;background:repeating-linear-gradient(90deg,var(--maroon) 0 38px,#f7f3ed 39px 42px),repeating-linear-gradient(0deg,transparent 0 3px,#d69c34 4px 5px);opacity:.86;margin:13px 0}
@media(max-width:820px){.grid.four{grid-template-columns:repeat(2,1fr)}.grid.three{grid-template-columns:repeat(2,1fr)}.header-top{height:70px}.brand-mini strong{font-size:1.08rem}.brand-mini small{display:none}.brand-mini img{width:50px;height:50px}.page{padding:15px 12px 22px}.construction-hero{padding:18px}.form-grid{grid-template-columns:1fr}.form-grid .span2{grid-column:auto}.quick-login{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.grid.two,.grid.three,.grid.four{grid-template-columns:1fr}.grid.mobile-two{grid-template-columns:repeat(2,1fr)}.card{padding:14px}.module{grid-template-columns:45px 1fr auto}.module-icon{width:45px;height:45px}.login-page{padding:12px}.login-panel{border-radius:22px}.login-hero{padding:20px}.logo-large{width:126px;height:126px}.brand-name{font-size:2rem}.login-body{padding:19px}.page-title h1{font-size:1.4rem}.hero-stat{gap:8px}.hero-stat div{flex:1;min-width:90px}.metric{grid-template-columns:95px 1fr 42px}.bottom-nav button{min-width:50px;padding:4px 3px}}
@media(min-width:900px){.app{padding-bottom:0}.bottom-nav{position:sticky;top:76px;bottom:auto;justify-content:center;gap:18px;padding:8px;background:#651020}.bottom-nav button{min-width:100px}.page{padding:24px}.modal-backdrop{place-items:center}.modal{border-radius:22px}.construction-hero{min-height:175px}}