:root{--navy:#112b46;--navy2:#173d60;--teal:#12a89d;--bg:#f3f6fa;--ink:#1d2b3a;--muted:#718096;--line:#e3eaf1;--white:#fff;--green:#15803d;--amber:#a16207;--red:#b91c1c}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 "Segoe UI",Arial,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0;border-radius:8px;padding:10px 14px;font-weight:600}.primary{background:var(--teal);color:white}.dark{background:var(--navy);color:white}.outline{background:white;border:1px solid var(--line);color:var(--ink)}.danger{background:#fff1f2;color:var(--red);border:1px solid #fecdd3}.muted{color:var(--muted)}.hidden{display:none!important}
#login{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:white}.login-side{background:linear-gradient(145deg,#0d233a,#194f70);color:white;padding:8vh 7vw;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.login-side:after{content:"";position:absolute;width:460px;height:460px;border:1px solid #ffffff25;border-radius:50%;right:-130px;bottom:-120px;box-shadow:0 0 0 55px #ffffff08,0 0 0 110px #ffffff06}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.08em}.brandmark{width:44px;height:44px;border-radius:12px;background:var(--teal);display:grid;place-items:center;font-size:21px}.login-side h1{font-size:clamp(30px,4vw,50px);line-height:1.12;max-width:540px;margin:0 0 18px}.login-side p{max-width:470px;color:#d0dfeb;font-size:16px}.login-note{color:#a9c1d2;font-size:12px}.login-panel{display:flex;align-items:center;justify-content:center;padding:35px}.login-card{width:min(390px,100%)}.login-card h2{font-size:28px;margin:0 0 6px}.field{display:flex;flex-direction:column;gap:6px;margin:16px 0}.field label{font-size:12px;font-weight:700;color:#425466}.field input,.field select,.field textarea{width:100%;padding:12px 13px;border:1px solid #d8e1eb;border-radius:8px;background:white;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px #12a89d1a}.login-card .primary{width:100%;padding:13px}.demo-hint{margin-top:15px;padding:12px;border-radius:8px;background:#effaf8;color:#28625e;font-size:12px}
#app{min-height:100vh}.topbar{height:68px;background:var(--navy);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:sticky;top:0;z-index:5}.topbrand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.04em}.mini-mark{background:var(--teal);width:32px;height:32px;border-radius:9px;display:grid;place-items:center}.top-right{display:flex;align-items:center;gap:15px}.user-pill{display:flex;align-items:center;gap:9px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d5f4ef;color:#126b65;font-weight:800}.layout{display:grid;grid-template-columns:235px 1fr;min-height:calc(100vh - 68px)}aside{background:#fff;border-right:1px solid var(--line);padding:22px 13px}.nav-label{font-size:10px;letter-spacing:.12em;color:#9aa7b6;font-weight:800;padding:8px 12px}.navbtn{width:100%;display:flex;align-items:center;gap:12px;text-align:left;background:transparent;color:#526273;padding:12px;border-radius:8px;margin:2px 0}.navbtn.active{background:#e8f8f6;color:#087d75;font-weight:700}.navbtn:hover{background:#f3f7fa}.navicon{width:20px;text-align:center}.side-bottom{margin-top:40px;padding:14px;background:#f5f8fb;border-radius:10px;font-size:12px;color:#6c7a89}.content{padding:28px;max-width:1600px;width:100%;margin:0 auto}.pagehead{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:22px}.pagehead h1{font-size:26px;margin:0 0 5px;letter-spacing:-.03em}.pagehead p{margin:0;color:var(--muted)}.actions{display:flex;gap:8px;flex-wrap:wrap}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:22px}.stat,.panel{background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 3px 12px #1b355008}.stat{padding:18px}.stat-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-weight:600}.stat-icon{width:34px;height:34px;border-radius:9px;background:#e8f8f6;color:#07867e;display:grid;place-items:center;font-size:17px}.stat-num{font-size:28px;font-weight:800;margin-top:12px;letter-spacing:-.04em}.stat-sub{font-size:11px;color:var(--muted);margin-top:2px}.panel{padding:20px;margin-bottom:18px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.panel-head h3{margin:0;font-size:16px}.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.search{border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-width:210px}.filter{border:1px solid var(--line);border-radius:8px;padding:10px;background:white;color:#4a5969}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:790px}th{text-align:left;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#8492a3;background:#f8fafc;padding:12px;border-bottom:1px solid var(--line)}td{padding:14px 12px;border-bottom:1px solid #edf1f5;font-size:13px}tbody tr:hover{background:#fbfdff}.ref{font-weight:800;color:#173d60}.subtext{font-size:11px;color:var(--muted);margin-top:3px}.status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.pending{background:#fff7df;color:var(--amber)}.approved{background:#eaf8ee;color:var(--green)}.rejected{background:#fff0f0;color:var(--red)}.draft{background:#edf2f7;color:#596579}.review{background:#eaf2ff;color:#2459a6}.lowest{color:var(--green);font-weight:800}.row-actions{display:flex;gap:6px}.smallbtn{padding:7px 9px;font-size:11px;border-radius:7px}.formgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px}.formgrid .field{margin:8px 0 14px}.full{grid-column:1/-1}.quote-table input{width:120px;padding:8px;border:1px solid var(--line);border-radius:6px}.quote-table td:first-child{min-width:200px}.totalbar{display:flex;justify-content:flex-end;gap:25px;background:#f7fafc;border-radius:8px;padding:14px;margin-top:12px;font-weight:700}.totalbar strong{font-size:18px;color:#087d75}.tabs{display:flex;gap:7px;border-bottom:1px solid var(--line);margin-bottom:18px}.tab{background:transparent;color:#68798b;border-radius:7px 7px 0 0;border-bottom:2px solid transparent}.tab.active{color:#087d75;border-bottom-color:var(--teal)}.activity{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #edf1f5}.activity:last-child{border:0}.activity-dot{width:9px;height:9px;border-radius:50%;background:var(--teal);margin-top:6px;flex:none}.activity strong{font-size:13px}.activity p{margin:3px 0 0;color:var(--muted);font-size:12px}.modal-backdrop{position:fixed;inset:0;background:#1022368a;display:grid;place-items:center;padding:18px;z-index:20}.modal{background:white;border-radius:14px;width:min(950px,100%);max-height:92vh;overflow:auto;padding:24px;box-shadow:0 20px 60px #06152540}.modalhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.modalhead h2{margin:0;font-size:21px}.xbtn{background:#f0f4f8;color:#506173;padding:7px 11px}.toast{position:fixed;right:24px;bottom:24px;background:#173d60;color:white;padding:13px 18px;border-radius:9px;box-shadow:0 10px 30px #00182a30;z-index:40}.empty{text-align:center;padding:40px;color:var(--muted)}.empty strong{display:block;color:#526273;margin-bottom:5px}
@media(max-width:1000px){.stats{grid-template-columns:repeat(2,1fr)}.layout{grid-template-columns:190px 1fr}.content{padding:20px}.formgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){#login{grid-template-columns:1fr}.login-side{padding:28px;min-height:250px}.login-side h1{font-size:30px}.login-side p{font-size:14px}.login-note{margin-top:25px}.login-panel{padding:28px 22px}.topbar{padding:0 15px}.topbrand span:last-child{display:none}.layout{display:block}aside{display:flex;overflow:auto;padding:8px;border-right:0;border-bottom:1px solid var(--line);gap:5px}.nav-label,.side-bottom{display:none}.navbtn{width:auto;white-space:nowrap;margin:0;padding:10px}.content{padding:17px}.stats{gap:9px}.stat{padding:13px}.stat-num{font-size:23px}.pagehead{display:block}.pagehead .actions{margin-top:14px}.formgrid{grid-template-columns:1fr}.full{grid-column:auto}.panel{padding:14px}.search{min-width:150px;flex:1}.top-right{gap:8px}.user-pill .user-name{display:none}}

a.navbtn{text-decoration:none}.btn{display:inline-block;border-radius:8px;padding:10px 14px;font-weight:600;text-decoration:none;cursor:pointer;border:0}
.btn.outline{border:1px solid var(--line)}.smallbtn.btn{padding:7px 9px;font-size:11px}
button:disabled{opacity:.5;cursor:not-allowed}.err{color:var(--red);margin-top:10px;min-height:18px;font-size:13px}
.field label{text-transform:uppercase}.matrix input{width:100%;min-width:110px;padding:8px;border:1px solid var(--line);border-radius:6px}
.matrix td:nth-child(2){min-width:200px}.matrix td:nth-child(3) input{min-width:70px}.matrix tfoot th,.matrix tfoot td{background:#f8fafc;border-top:1px solid var(--line)}
.matrix input[type=radio]{width:auto;min-width:0}.r{text-align:right}.xs{background:none;color:var(--red);padding:4px 8px}
.sheet th{white-space:nowrap}.low{background:#eaf8ee;color:var(--green);font-weight:800}.rec{box-shadow:inset 0 0 0 2px var(--teal)}
.sign{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.sign div{border:1px solid var(--line);border-radius:10px;padding:12px;min-height:100px}.sign small{display:block;color:var(--muted);margin-top:3px}
.sheet-title{text-align:center;margin:0 0 4px}.nav-count{margin-left:auto;background:#fff0c2;color:#956300;padding:2px 7px;border-radius:12px;font-size:10px}
.login-card .err{margin:12px 0 0}
@media(max-width:700px){.sign{grid-template-columns:1fr}}
@media print{.topbar,aside,.noprint,.toast{display:none!important}.layout{display:block}.content{padding:0}.panel,.stat{box-shadow:none;border:0}body{background:#fff}}