*{box-sizing:border-box} :root{--navy:#101d36;--navy2:#1b2b49;--ink:#1b2940;--muted:#7b8799;--line:#e9edf3;--bg:#f5f7fb;--teal:#16a58a;--teal-light:#e8f7f3;--gold:#d7a64b;--red:#d96b6b;--white:#fff}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.login-screen{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.login-card{width:min(410px,calc(100% - 48px));margin:auto;padding:45px 0}.login-brand{height:104px;width:100%;border-radius:16px;overflow:hidden;background:#e7e5e1;margin-bottom:34px}.login-brand video{width:100%;height:100%;object-fit:cover}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:800;color:#15977f}.login-card h1,.welcome h1,.page-heading h1{font:800 32px Manrope,sans-serif;letter-spacing:-1.1px;margin:10px 0}.login-card p,.welcome p,.page-heading p{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 28px}.login-card label,.field label{display:block;font-size:11px;font-weight:700;color:#59677c;margin:15px 0 7px}.login-card input,.field input,.field select,.select{height:44px;border:1px solid #e1e6ee;border-radius:9px;background:#fff;padding:0 13px;width:100%;outline:none;color:var(--ink)}input:focus,select:focus{border-color:#3bb49b!important;box-shadow:0 0 0 3px #16a58a18}.primary{background:var(--teal);color:#fff;border:0;border-radius:9px;padding:12px 17px;font-weight:700;box-shadow:0 5px 12px #16a58a25}.primary:hover{background:#118d76}.wide{width:100%;margin-top:22px;display:flex;justify-content:space-between;align-items:center}.error{color:#c54f4f;font-size:12px;min-height:16px;margin-top:8px}.login-card small{display:block;text-align:center;color:#a1aab7;margin-top:25px;font-size:10px}.login-side{background:var(--navy);color:white;position:relative;overflow:hidden;display:flex;align-items:center;padding:9%;min-height:100vh}.side-orb{position:absolute;width:560px;height:560px;border:1px solid #ffffff15;border-radius:50%;right:-130px;top:5%;box-shadow:0 0 0 60px #ffffff08,0 0 0 120px #ffffff05}.side-copy{position:relative;max-width:460px}.side-copy span{font-size:10px;letter-spacing:2px;color:#5bd0b3;font-weight:800}.side-copy h2{font:800 clamp(32px,4vw,52px)/1.15 Manrope;letter-spacing:-1.5px;margin:24px 0}.side-copy p{color:#aab7cb;line-height:1.7}.side-foot{position:absolute;bottom:35px;left:9%;font-size:10px;letter-spacing:1.8px;color:#8492a9}.side-foot span{color:#4dc2a5;margin:0 7px}.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:244px;background:var(--navy);color:white;padding:27px 17px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:11px;padding:0 9px 37px}.brand-mark{width:36px;height:36px;border-radius:11px;background:#16a58a;display:grid;place-items:center;font:800 18px Manrope}.brand b{font:700 14px Manrope;display:block}.brand small{display:block;font-size:8px;letter-spacing:1.5px;color:#8290a7;margin-top:3px}.nav-label{font-size:9px;letter-spacing:1.5px;color:#6e7e98;font-weight:800;padding:0 12px 11px}.nav-label.spaced{margin-top:27px}.nav-item{border:0;background:transparent;color:#aebbd0;width:100%;height:45px;text-align:left;border-radius:8px;padding:0 12px;display:flex;align-items:center;gap:12px;font-size:13px;margin:2px 0}.nav-item i{font-style:normal;font-size:18px;width:20px;text-align:center}.nav-item span{margin-left:auto;opacity:0}.nav-item:hover,.nav-item.active{background:#203452;color:#fff}.nav-item.active{box-shadow:inset 3px 0 #21b597}.nav-item.active span{opacity:1}.sidebar-bottom{margin-top:auto}.mini-profile{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff15;padding:18px 4px 12px}.avatar,.top-avatar{width:34px;height:34px;background:#d7a64b;color:#17233b;border-radius:50%;display:grid;place-items:center;font-weight:800}.mini-profile b{font-size:12px;display:block}.mini-profile small{font-size:10px;color:#8f9eb4}.mini-profile button{margin-left:auto;border:0;background:transparent;color:#9eabc0}.version{font-size:8px;letter-spacing:1px;color:#6e7e98;padding-left:4px}.main{margin-left:244px;min-height:100vh}.topbar{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;position:sticky;top:0;z-index:5}.crumb{font-size:12px;color:#8994a4}.crumb span{margin:0 10px;color:#c4cbd5}.crumb b{color:#273750}.top-right{display:flex;align-items:center;gap:16px}.today{font-size:11px;color:#7f8a9b}.top-avatar{width:30px;height:30px;font-size:12px}.mobile-menu{display:none}.content{max-width:1500px;margin:auto;padding:34px 38px 22px}.page{display:none}.page.active{display:block}.welcome,.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.welcome h1,.page-heading h1{font-size:29px}.welcome h1 span{color:var(--gold);font-size:19px}.welcome p,.page-heading p{margin:0}.year-pill,.tag{font-size:9px;letter-spacing:1.2px;font-weight:800;color:#168e78;background:#e8f7f3;padding:10px 13px;border-radius:8px}.year-pill b{font-size:13px;margin-left:6px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.metric{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px 18px;min-height:116px;position:relative;overflow:hidden}.metric .metric-label{font-size:10px;color:#8994a4;font-weight:700}.metric .metric-value{font:800 22px Manrope;letter-spacing:-.7px;margin:12px 0 4px}.metric .metric-note{font-size:10px;color:#a0a9b6}.metric .metric-icon{position:absolute;right:16px;top:16px;width:32px;height:32px;border-radius:9px;background:#eaf7f4;color:#14977e;display:grid;place-items:center;font-size:17px}.panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:17px;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:17px}.panel-head h2{font:700 15px Manrope;margin:0 0 5px}.panel-head p{font-size:10px;color:#98a2b1;margin:0}.chart-panel{padding:22px 22px 17px}.chart-area{height:220px;display:flex;align-items:flex-end;gap:clamp(5px,1.6vw,20px);padding:15px 4px 0;border-bottom:1px solid var(--line);position:relative}.bar-col{height:100%;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;min-width:0}.bar-value{font-size:9px;color:#758298;white-space:nowrap}.bar{width:min(32px,70%);min-height:3px;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#31c3a4,#138c78);transition:height .3s}.bar-month{font-size:9px;color:#8b96a6;white-space:nowrap}.legend{display:flex;gap:20px;padding-top:13px;font-size:10px;color:#7f8a9a}.legend span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:#20aa90;margin-right:6px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:17px}.text-button{border:0;background:none;color:#15977f;font-size:10px;font-weight:700}.cat-row{display:grid;grid-template-columns:95px 1fr 90px;gap:10px;align-items:center;margin:14px 0}.cat-row label{font-size:10px;color:#6f7b8e}.track{height:7px;background:#eef1f5;border-radius:9px;overflow:hidden}.fill{height:100%;background:#20aa90;border-radius:9px}.cat-row b{font-size:10px;text-align:right}.recent-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f0f2f5}.recent-item:last-child{border:0}.recent-icon{width:30px;height:30px;border-radius:9px;background:#f0f5f7;color:#168f7b;display:grid;place-items:center}.recent-main{min-width:0;flex:1}.recent-main b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent-main small{font-size:9px;color:#9aa4b1}.recent-item strong{font-size:10px}.filter-panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px;margin-bottom:15px}.filter-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:12px}.field label{font-size:10px;margin:0 0 6px}.field input,.field select{height:39px;font-size:11px}.filter-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:13px;padding-top:11px;border-top:1px solid #f0f2f5}.selected-chips{display:flex;gap:6px;flex-wrap:wrap}.chip{font-size:9px;background:#e8f7f3;color:#168c77;border-radius:20px;padding:5px 9px}.quiet,.outline{border:1px solid #e3e8ef;background:#fff;color:#69778b;border-radius:7px;padding:8px 11px;font-size:10px;font-weight:700}.record-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:15px}.summary-box{background:#fff;border:1px solid var(--line);border-radius:10px;padding:13px 16px}.summary-box small{display:block;color:#929cab;font-size:9px}.summary-box b{display:block;font:800 17px Manrope;margin-top:6px}.table-panel{padding:19px 0 0}.table-panel>.panel-head{padding:0 20px}.table-wrap{overflow:auto;max-width:100%}table{border-collapse:collapse;width:100%;font-size:10px;white-space:nowrap}th{background:#f7f9fc;color:#8490a1;font-size:9px;text-align:left;padding:11px 13px;font-weight:700;position:sticky;top:0}td{padding:11px 13px;border-bottom:1px solid #f0f2f5;color:#526176}td:first-child{color:#26364e;font-weight:600}tr:hover td{background:#fbfcfe}.money{font-weight:700;color:#253750}.status{padding:4px 7px;border-radius:5px;background:#eaf7f3;color:#138c76;font-size:8px}.status.pending{background:#fff5e6;color:#b67d24}.status.cancel{background:#fff0f0;color:#c45b5b}.pagination{padding:12px 20px;display:flex;justify-content:space-between;align-items:center;color:#8b96a6;font-size:10px}.pagination button{border:1px solid var(--line);background:white;border-radius:6px;padding:6px 10px;margin-left:5px}.reserve-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.reserve-card{border:1px solid var(--line);border-radius:10px;padding:15px;display:flex;align-items:center;gap:12px}.reserve-icon{width:38px;height:38px;border-radius:10px;background:#eef8f5;color:#14977e;display:grid;place-items:center;font-size:17px}.reserve-card div:nth-child(2){flex:1}.reserve-card b{font-size:11px;display:block}.reserve-card small{font-size:9px;color:#9ba5b2}.reserve-card strong{font:700 14px Manrope}.modal{position:fixed;inset:0;background:#101d3680;display:grid;place-items:center;padding:18px;z-index:30}.modal-card{width:min(540px,100%);background:#fff;border-radius:15px;padding:23px;box-shadow:0 25px 70px #101d3640}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h2{font:800 20px Manrope;margin:6px 0 17px}.close{border:0;background:#f1f4f7;width:30px;height:30px;border-radius:50%;font-size:20px;color:#68778b}.modal-form{display:grid;grid-template-columns:1fr 1fr;gap:13px}.modal-form .field{min-width:0}.modal-form .field label{margin:0 0 6px}.modal-form .full{grid-column:1/-1}.modal-note{font-size:10px;color:#8f9aaa;line-height:1.5}.page-heading{align-items:flex-end}footer{font-size:9px;color:#a1aab7;text-align:center;padding:20px 0 4px}footer span{margin:0 5px;color:#24a88f}
@media(max-width:1100px){.sidebar{width:210px}.main{margin-left:210px}.content{padding:27px 24px}.topbar{padding:0 24px}.filter-grid{grid-template-columns:repeat(3,1fr)}.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.login-screen{grid-template-columns:1fr}.login-card{padding:35px 0}.login-side{display:none}.sidebar{width:260px;transform:translateX(-100%);transition:transform .25s;box-shadow:10px 0 40px #101d3620}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.topbar{height:58px;padding:0 15px;gap:10px}.mobile-menu{display:block;border:0;background:none;font-size:19px;color:#253750}.crumb{font-size:10px;margin-right:auto}.today{display:none}.content{padding:23px 14px}.welcome,.page-heading{align-items:flex-start}.welcome h1,.page-heading h1{font-size:24px}.welcome p,.page-heading p{font-size:11px}.year-pill{font-size:8px;padding:8px}.metric-grid{gap:9px}.metric{padding:13px;min-height:102px}.metric .metric-value{font-size:18px}.metric .metric-icon{right:10px;top:10px;width:26px;height:26px}.two-col{grid-template-columns:1fr;gap:0}.panel{padding:15px;margin-bottom:12px}.chart-panel{padding:16px 12px}.chart-area{height:175px;gap:5px}.bar-value{font-size:7px}.bar-month{font-size:8px}.filter-grid{grid-template-columns:1fr 1fr}.filter-grid .field:first-child{grid-column:1/-1}.record-summary{gap:7px}.summary-box{padding:10px}.summary-box b{font-size:14px}.summary-box small{font-size:8px}.page-heading{gap:8px}.page-heading .primary{font-size:10px;padding:10px}.reserve-list{grid-template-columns:1fr}.panel-head h2{font-size:13px}.panel-head p{font-size:9px}.table-panel{padding-top:15px}.table-panel>.panel-head{padding:0 14px}.table-wrap table{min-width:650px}.filter-panel{padding:13px}.filter-bottom{align-items:flex-start}.modal-form{grid-template-columns:1fr 1fr}}
@media(max-width:380px){.metric .metric-value{font-size:16px}.filter-grid{grid-template-columns:1fr}.filter-grid .field:first-child{grid-column:auto}.year-pill{display:none}}

.multi-select{position:relative}.select-like{height:39px;border:1px solid #e1e6ee;border-radius:9px;background:#fff;padding:0 11px;width:100%;text-align:left;color:#59677c;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multi-options{display:none;position:absolute;top:43px;left:0;right:0;z-index:12;background:#fff;border:1px solid #e1e6ee;border-radius:9px;box-shadow:0 12px 28px #101d3620;padding:7px;max-height:240px;overflow:auto}.multi-options.open{display:block}.multi-option{display:flex;align-items:center;gap:8px;padding:7px 5px;font-size:10px;color:#526176;border-radius:5px;cursor:pointer}.multi-option:hover{background:#f4f8f8}.multi-option input{accent-color:#16a58a}
