.profile:after{content:'Versi 2.3.1 Stable'}.service-type-choice select{max-width:360px}.jobform [hidden]{display:none!important}.item-edit-head{align-items:center}.item-edit-head h2{margin:0}.close-item-edit{width:auto;margin:0}.claim-form input[type=file],.inventory-bulk input[type=file]{padding:8px}.inventory-bulk{display:flex;flex-wrap:wrap;align-items:end;gap:9px;margin:0 0 16px}.inventory-bulk form{display:flex;align-items:end;gap:8px}.inventory-bulk label{margin:0;min-width:250px}.content .range-filter,.content .job-status-filter,.content .history-filter{width:100%;grid-template-columns:minmax(220px,1.5fr) minmax(150px,.75fr) minmax(150px,.75fr) auto auto}.role-staff .staff-add-inventory,.role-staff .staff-stock-movement{width:min(760px,100%);margin-left:auto;margin-right:auto}.role-staff .staff-add-inventory .grid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:900px){.content .range-filter,.content .job-status-filter,.content .history-filter{grid-template-columns:1fr 1fr}.inventory-bulk,.inventory-bulk form{width:100%}}@media(max-width:560px){.content .range-filter,.content .job-status-filter,.content .history-filter,.role-staff .staff-add-inventory .grid{grid-template-columns:1fr}.content .range-filter>*,.content .job-status-filter>*,.content .history-filter>*,.inventory-bulk form,.inventory-bulk label,.inventory-bulk input,.inventory-bulk button,.inventory-bulk .btn{grid-column:1;width:100%}.inventory-bulk form{display:grid}}
.profile:after{content:'Versi 2.3.2 Stable'}
.claim-proof-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.claim-proof-options{grid-template-columns:1fr}}
.profile:after{content:'Versi 2.3.3 Stable'}
.role-staff .staff-inventory-forms{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%;align-items:start}
.role-staff .staff-inventory-forms .staff-add-inventory,.role-staff .staff-inventory-forms .staff-stock-movement{width:100%;margin:0}
@media(max-width:900px){.role-staff .staff-inventory-forms{grid-template-columns:1fr}}
.profile:after{content:'Versi 2.3.4 Stable'}
.profile:after{content:'Versi 2.3.5 Stable'}
.profile:after{content:'Versi 2.3.6 Stable'}
.last-login{order:3;margin-top:8px;color:#87919e!important;line-height:1.35}.profile:after{order:4}.language-box{order:5}
.receipt-disabled{background:#4b3512;color:#ffd27a;white-space:nowrap}.receipt-blocked{text-align:center}.receipt-blocked .alert{line-height:1.7}.upload-help{display:block;margin:-6px 0 14px;color:var(--muted)}
@media(max-width:900px){aside .brand{padding-left:14px}.content>header .menu{position:relative;z-index:2;margin-right:4px}.content>header>div{padding-left:5px;min-width:0}.content>header h1,.content>header p{overflow-wrap:anywhere}.brand:before{flex-basis:38px;width:38px;height:38px}.brand:after{font-size:15px}.staff-inventory-forms{width:100%}.staff-inventory-forms>.panel{max-width:none;width:100%}}
@media(max-width:430px){.content>header{grid-template-columns:44px minmax(0,1fr)}.content>header .menu{width:42px;padding:9px 0;margin:0}.content>header>div{padding-left:8px}.content>header h1{font-size:20px}.content>header p{font-size:12px}.brand{gap:10px!important;padding-left:20px!important}.brand:after{font-size:14px}.inventory-bulk{grid-template-columns:1fr}.receipt-disabled{white-space:normal}}
.profile:after{content:'Versi 2.3.7 Stable'}
.login .auth:after{content:'Versi 2.3.7 Stable';display:block;margin-top:18px;padding-top:12px;border-top:1px solid #303844;color:#87919e;text-align:center;font-size:12px;letter-spacing:.04em}
.item-category-filter:invalid{outline:none}
@media(max-width:900px){.staff-inventory-forms,.staff-inventory-forms>.panel{min-width:0;max-width:100%;width:100%}.staff-inventory-forms select,.staff-inventory-forms input,.staff-inventory-forms textarea{max-width:100%}.item-picker-tools{width:100%;min-width:0}.content .tablewrap{-webkit-overflow-scrolling:touch}}
@media(max-width:560px){.staff-inventory-forms{display:grid;grid-template-columns:minmax(0,1fr)}.staff-inventory-forms>.panel{padding:14px}.itemrow{width:100%;min-width:0}.item-picker-tools{grid-template-columns:minmax(0,1fr)}.login .auth{padding:24px 20px}}
.profile:after{content:'Versi 2.3.8 Stable'}
.login .auth:after{content:'Versi 2.3.8 Stable'}
.item-edit-remark{display:inline-block;margin:5px 0 0 4px;padding:4px 7px;border-radius:7px;background:#2a333f;color:#aeb8c5!important;white-space:normal;vertical-align:middle;line-height:1.3}
@media(max-width:560px){.item-edit-remark{display:block;margin:7px 0 0;max-width:190px}.edit-mini,.delete-mini{margin-bottom:3px}}
.profile:after{content:'Versi 2.3.9 Stable'}
.login .auth:after{content:'Versi 2.3.9 Stable'}
.service-kit-panel{margin-top:20px}.service-kit-panel h3{margin:0;font-size:15px}.kit-form{min-width:0}.kit-component{display:grid;grid-template-columns:minmax(0,1fr) 82px 42px;gap:8px;margin-bottom:8px}.kit-component button{padding:8px}.job-kit-choice{padding:14px;background:#0d1219;border:1px solid var(--line);border-radius:10px}.job-kit-choice small{color:var(--muted);font-weight:400}.service-kit-panel .wrap-cell{white-space:normal}
@media(max-width:900px){.service-kit-panel>.twocol{grid-template-columns:1fr}.service-kit-panel .tablewrap{max-width:100%}}
@media(max-width:560px){.kit-component{grid-template-columns:minmax(0,1fr) 68px 40px}.job-kit-choice{grid-column:1/-1}.service-kit-panel{padding:14px}.service-kit-panel .section-head button{width:auto}}
.profile:after{content:'Versi 2.4.13 Stable'}
.login .auth:after{content:'Versi 2.4.13 Stable'}

.activity-filter{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:14px 0}.activity-filter label{max-width:220px}.activity-filter button{width:auto;padding:9px 15px;margin:0}
@media(max-width:700px){.activity-filter{display:grid;grid-template-columns:1fr 1fr}.activity-filter label{max-width:none}.activity-filter button{width:100%}}
@media(max-width:430px){.activity-filter{grid-template-columns:1fr}.activity-filter>*{grid-column:1;width:100%}.jobform #brandWrap,.jobform #modelWrap,.jobform #modelOtherWrap{grid-column:1;width:100%}}
.full-item-edit{max-width:760px}.full-item-edit .existing-item-image{display:grid;gap:7px;margin-bottom:13px}.full-item-edit .existing-item-image img{width:min(220px,100%);max-height:170px;object-fit:cover;border:1px solid var(--line);border-radius:9px}.full-item-edit input[type=file]{padding:8px}
@media(max-width:560px){.full-item-edit{width:100%;max-width:100%}.full-item-edit .existing-item-image img{width:100%}}
.claim-actions{display:flex;align-items:center;gap:7px}.claim-status-form{display:flex;align-items:center;gap:6px}.claim-status-form select,.claim-status-form button{width:auto;padding:7px 9px}.tag.claim-pending{background:#4b3512;color:#ffd27a}.tag.claim-approved{background:#123c2e;color:#73e3b2}.tag.claim-rejected{background:#491b20;color:#ff9096}
@media(max-width:560px){.service-kit-panel>.twocol{display:grid;grid-template-columns:minmax(0,1fr)}.service-kit-panel .kit-form,.service-kit-panel .kit-components{min-width:0;width:100%}.service-kit-panel .kit-component{grid-template-columns:minmax(0,1fr) 52px}.service-kit-panel .kit-component select{grid-column:1/-1;min-width:0}.service-kit-panel .kit-component input,.service-kit-panel .kit-component button{width:100%;min-width:0}.service-kit-panel .tablewrap{width:100%;overflow-x:auto}.claim-actions,.claim-status-form{min-width:250px}}
.waste-reason[hidden]{display:none!important}
.tag.waste{background:#7f1d1d;color:#fecaca}
.profile:after{content:'Versi 2.4.14 Stable'}
.login .auth:after{content:'Versi 2.4.14 Stable'}
.profile:after{content:'Versi 2.4.14.1 Stable'}
.profile:after{content:'Versi 2.4.27 Stable'}
.login .auth:after{content:'Versi 2.4.27 Stable'}
.inventory-thumb-cell{width:58px;text-align:center}.inventory-thumb{display:inline-flex;width:42px;height:42px;object-fit:cover;border-radius:7px;border:1px solid var(--line);align-items:center;justify-content:center}.inventory-thumb-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.item-image-empty{background:#202936;color:#7f8a99;font-size:19px}
.image-select-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.image-item-picker{position:relative;min-width:0;width:100%}.image-picker-toggle{display:flex;width:100%;min-height:48px;align-items:center;justify-content:space-between;gap:9px;background:#0d1219;border:1px solid var(--line);color:var(--text);padding:7px 10px;text-align:left}.image-picker-toggle>span{display:flex;align-items:center;gap:9px;min-width:0}.image-picker-toggle span span{display:grid;min-width:0}.image-picker-toggle small,.image-picker-option small{display:block;color:var(--muted);font-weight:400;white-space:normal}.picker-thumb{display:inline-flex;flex:0 0 38px;width:38px;height:38px;object-fit:cover;border:1px solid var(--line);border-radius:6px;align-items:center;justify-content:center}.image-picker-menu{position:absolute;z-index:40;top:calc(100% + 5px);left:0;right:0;background:#111821;border:1px solid #425166;border-radius:9px;padding:8px;box-shadow:0 14px 34px #000a}.image-picker-menu input{margin:0 0 7px}.image-picker-options{max-height:260px;overflow:auto}.image-picker-option{display:flex;width:100%;align-items:center;justify-content:flex-start;gap:9px;background:transparent;border:0;border-radius:7px;padding:7px;color:var(--text);text-align:left}.image-picker-option:hover,.image-picker-option:focus{background:#222d3a}.picker-no-result{display:block;padding:12px;color:var(--muted)}
.service-kit-panel .kit-component{grid-template-columns:minmax(150px,.8fr) minmax(0,1.2fr) 82px 42px}.kit-component .kit-category-filter{min-width:0}.kit-component .image-item-picker{min-width:0}
@media(max-width:700px){.inventory-thumb{width:36px;height:36px}.service-kit-panel .kit-component{grid-template-columns:minmax(0,1fr) 62px 42px}.kit-component .kit-category-filter,.kit-component .image-item-picker{grid-column:1/-1}.image-picker-menu{position:fixed;left:12px;right:12px;top:auto;bottom:12px;max-height:70vh}.image-picker-options{max-height:48vh}}
.inventory-entry-forms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;width:100%;align-items:start}.inventory-entry-forms>.inventory-entry-form{width:100%;min-width:0;margin:0}.inventory-entry-form select,.inventory-entry-form input,.inventory-entry-form textarea{max-width:100%}
.table-pagination{margin:12px 0 4px}.table-pagination[hidden]{display:none!important}
@media(max-width:900px){.inventory-entry-forms{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){
 .inventory-search{display:grid!important;grid-template-columns:1fr!important}.inventory-search>*{grid-column:1!important;width:100%!important}
 .current-stock-panel{min-width:0;overflow:visible}.current-stock-panel>.tablewrap{overflow:visible}.current-stock-panel table{white-space:normal}.current-stock-panel thead{display:none}.current-stock-panel tbody{display:grid;gap:10px}
 .current-stock-panel tbody tr{display:grid;grid-template-columns:1fr;background:#0d1219;border:1px solid var(--line);border-radius:10px;padding:8px}
 .current-stock-panel tbody td{display:grid;grid-template-columns:105px minmax(0,1fr);gap:9px;align-items:center;padding:7px;border:0;border-bottom:1px solid #202a36;min-width:0;overflow-wrap:anywhere}.current-stock-panel tbody td:last-child{border-bottom:0}
 .current-stock-panel tbody td:before{content:attr(data-mobile-label)}
 .current-stock-panel tbody td:before{color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase}.inventory-thumb-cell{text-align:left;width:auto}.inventory-thumb{width:42px;height:42px}
 .inventory-bulk,.inventory-bulk form{display:grid!important;grid-template-columns:1fr;width:100%}.inventory-bulk>*{width:100%;text-align:center}.inventory-bulk label{min-width:0!important;text-align:left}
 .inventory-entry-forms,.service-kit-panel>.twocol{display:grid!important;grid-template-columns:minmax(0,1fr)!important}.inventory-entry-forms>.inventory-entry-form,.service-kit-panel .kit-form{width:100%;min-width:0;padding:14px}
}

/* v2.4.27: balanced iPad forms and compact Branch selector. */
@media (hover:none) and (pointer:coarse) and (min-width:601px) and (max-width:1366px){
 .content>header{grid-template-columns:48px minmax(260px,1fr) minmax(190px,260px);align-items:start}
 .content>header>form{grid-column:3;width:100%;max-width:260px;justify-self:end}
 .content>header>form select{width:100%;max-width:260px}
 .content form .grid{grid-template-columns:repeat(2,minmax(260px,1fr))}
 .content form .twocol{grid-template-columns:repeat(2,minmax(260px,1fr))}
}
@media (hover:none) and (pointer:coarse) and (min-width:601px) and (max-width:767px){
 .content>header{grid-template-columns:48px minmax(0,1fr)}
 .content>header>form{grid-column:2;width:min(240px,100%);max-width:240px;justify-self:end}
 .content form .grid,.content form .twocol{grid-template-columns:minmax(0,1fr)}
}

/* KeyFlow v2.5.0 Beta UI — core functions remain based on v2.4.27. */
:root{
 --kf-bg:#07111c;
 --kf-bg-soft:#0b1724;
 --kf-sidebar:#08131f;
 --kf-panel:#0e1c2a;
 --kf-panel-2:#112335;
 --kf-line:#203a50;
 --kf-line-soft:#172d40;
 --kf-text:#eef7ff;
 --kf-muted:#8fa8bc;
 --kf-blue:#11b9ff;
 --kf-blue-2:#0878ee;
 --kf-cyan:#55d8ff;
 --kf-green:#35d39a;
 --kf-amber:#ffbd59;
 --kf-red:#ff6572;
 --kf-shadow:0 18px 50px rgba(0,0,0,.24);
}
html{background:var(--kf-bg)}
body.keyflow-app{background:linear-gradient(145deg,#07111c 0%,#091624 55%,#07111c 100%);color:var(--kf-text)}
body.keyflow-app .content{background:transparent}
body.keyflow-app aside{background:linear-gradient(180deg,#07121d 0%,#0a1723 55%,#06101a 100%);border-right:1px solid var(--kf-line-soft);box-shadow:16px 0 44px rgba(0,0,0,.18)}
.keyflow-brand{height:104px!important;padding:12px 16px 18px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-bottom:1px solid var(--kf-line-soft)}
.keyflow-brand:before,.keyflow-brand:after{display:none!important;content:none!important}
.keyflow-brand img{display:block!important;width:100%!important;height:72px!important;max-width:220px!important;object-fit:contain!important;object-position:center!important;filter:drop-shadow(0 0 14px rgba(19,181,255,.2))}
.nav-caption{padding:20px 20px 8px;color:#5f7e95;font-size:11px;font-weight:800;letter-spacing:.16em}
body.keyflow-app aside nav{padding:0 12px 14px}
body.keyflow-app aside nav a{position:relative;display:flex;align-items:center;min-height:44px;margin:3px 0;padding:10px 12px 10px 44px;border:1px solid transparent;border-radius:10px;color:#9eb3c4;font-size:14px;font-weight:650;transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease}
body.keyflow-app aside nav a:before{position:absolute;left:13px;top:50%;width:21px;height:21px;display:grid;place-items:center;transform:translateY(-50%);border:1px solid #29445a;border-radius:6px;color:#71cfff;font-size:12px;line-height:1;background:#0c1d2b}
body.keyflow-app aside nav a:hover{background:#0e2232;color:#eff8ff;border-color:#1d3d55;transform:translateX(2px)}
body.keyflow-app aside nav a.on{background:linear-gradient(90deg,rgba(11,139,234,.24),rgba(17,185,255,.08));color:#fff;border-color:#1d638a;box-shadow:inset 3px 0 0 var(--kf-blue)}
body.keyflow-app aside nav a.on:before{color:#fff;background:linear-gradient(145deg,var(--kf-blue-2),var(--kf-blue));border-color:#36c6ff;box-shadow:0 0 14px rgba(17,185,255,.28)}
.nav-dashboard:before{content:'⌂'}.nav-new-job:before{content:'＋'}.nav-job-status:before{content:'◎'}.nav-jobs:before{content:'↗'}.nav-inventory:before{content:'▦'}.nav-inventory-history:before{content:'↻'}.nav-expenses:before{content:'−'}.nav-claims:before{content:'✓'}.nav-tax-zakat:before{content:'%'}.nav-payroll:before{content:'$'}.nav-reports:before{content:'▥'}.nav-settings:before{content:'⚙'}
body.keyflow-app aside .profile{position:relative;display:grid;grid-template-columns:38px 1fr;column-gap:10px;padding:14px 16px 16px;margin:0 12px 12px;border:1px solid var(--kf-line-soft);border-radius:12px;background:rgba(3,12,20,.7)}
.profile-avatar{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:linear-gradient(145deg,var(--kf-blue-2),var(--kf-blue));color:white;font-weight:850;box-shadow:0 7px 22px rgba(8,120,238,.25)}
body.keyflow-app aside .profile b,body.keyflow-app aside .profile small{grid-column:2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.keyflow-app aside .profile a{grid-column:1/-1;display:flex;justify-content:space-between;margin-top:12px;padding-top:11px;border-top:1px solid var(--kf-line-soft);color:#88cfff;font-weight:700}
body.keyflow-app .profile:after{grid-column:1/-1;content:'KeyFlow Beta · Core 2.4.27';order:initial;margin:10px 0 0;padding:0;border:0;color:#58758b;text-align:left;font-size:11px}
body.keyflow-app .language-box{grid-column:1/-1}
body.keyflow-app .content>header{position:relative;align-items:center;margin-bottom:22px;padding:4px 2px 18px;border-bottom:1px solid var(--kf-line-soft)}
.page-eyebrow{display:block;margin-bottom:3px;color:#43c8ff;font-size:10px;font-weight:850;letter-spacing:.16em}
body.keyflow-app .content>header h1{margin:0;color:#f4f9fd;font-size:27px;line-height:1.15;letter-spacing:-.03em}
body.keyflow-app .content>header p{margin:4px 0 0;color:#718ca1;font-size:13px}
.branch-switcher label{margin:0;color:#718ca1;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.branch-switcher label span{display:block;margin-bottom:5px}
.branch-switcher select{min-height:43px!important;background:#0c1d2b!important;border-color:#254158!important;border-radius:10px!important;color:#eaf6ff!important}
body.keyflow-app .menu{border:1px solid #29465d;background:#0e2232;color:#6ed2ff;border-radius:10px;box-shadow:none}
body.keyflow-app .panel,body.keyflow-app .cards article{background:linear-gradient(155deg,rgba(17,35,53,.96),rgba(10,25,38,.96));border:1px solid var(--kf-line);border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.16)}
body.keyflow-app .panel h2{color:#f2f8fc;letter-spacing:-.02em}
body.keyflow-app input,body.keyflow-app select,body.keyflow-app textarea{background:#091723;border-color:#284258;color:#eef7ff;border-radius:9px}
body.keyflow-app input:focus,body.keyflow-app select:focus,body.keyflow-app textarea:focus{border-color:var(--kf-blue);box-shadow:0 0 0 3px rgba(17,185,255,.12);outline:none}
body.keyflow-app button,body.keyflow-app .btn{border-radius:9px;background:linear-gradient(135deg,var(--kf-blue-2),var(--kf-blue));color:#fff;font-weight:750;box-shadow:0 8px 24px rgba(8,120,238,.18)}
body.keyflow-app table{color:#dbeaf4}
body.keyflow-app th{background:#0b1a28;color:#7fa0b8;border-color:#1d3447;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
body.keyflow-app td{border-color:#1b3042}
body.keyflow-app tbody tr:hover{background:rgba(17,185,255,.035)}
.dashboard-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin:0 0 16px;padding:0 2px}
.dashboard-intro .eyebrow,.performance-panel .eyebrow,.quick-panel .eyebrow{display:block;margin-bottom:5px;color:#4acbff;font-size:10px;font-weight:850;letter-spacing:.14em}
.dashboard-intro h2{margin:0;color:#f3f9fd;font-size:23px;letter-spacing:-.03em}.dashboard-intro p{margin:5px 0 0;color:var(--kf-muted);font-size:13px}
.dashboard-actions{display:flex;gap:9px}.dashboard-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 15px;text-decoration:none}.dashboard-actions .secondary-action{background:#0d202f;border:1px solid #27465c;color:#9ddcff;box-shadow:none}
.keyflow-cards{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;margin-bottom:18px}
.keyflow-cards article{position:relative;display:flex!important;min-width:0;min-height:142px;padding:18px!important;flex-direction:column;justify-content:flex-end;overflow:hidden}
.keyflow-cards article:after{content:'';position:absolute;right:-24px;top:-34px;width:90px;height:90px;border-radius:50%;background:rgba(17,185,255,.07);filter:blur(1px)}
.keyflow-cards .metric-icon{position:absolute;top:15px;right:15px;display:grid;place-items:center;width:30px;height:30px;border:1px solid #2a536e;border-radius:9px;background:#0c2435;color:#72d4ff;font-style:normal;font-weight:850}
.keyflow-cards small{color:#8ca6ba!important;font-size:12px!important;font-weight:700}.keyflow-cards strong{display:block;margin:8px 0 5px;color:#f5fbff!important;font-size:23px!important;line-height:1.1;letter-spacing:-.04em;white-space:normal!important;overflow-wrap:anywhere}.keyflow-cards em{color:#607f96;font-size:11px;font-style:normal}
.keyflow-cards .metric-sales{border-color:#17628c}.keyflow-cards .metric-sales strong{color:#68d6ff!important}.keyflow-cards .metric-alert .metric-icon{border-color:#735434;background:#2b2118;color:var(--kf-amber)}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.7fr);gap:16px;margin-bottom:18px}.dashboard-grid>.panel{margin:0!important;min-width:0}.dashboard-grid .section-head{align-items:flex-start}.dashboard-grid .section-head h2{margin:0}.dashboard-grid .section-head a{color:#61d1ff;font-size:12px;font-weight:750;text-decoration:none}
.sales-chart{display:flex;align-items:flex-end;gap:10px;height:250px;margin-top:12px;padding:22px 10px 2px;border-top:1px solid var(--kf-line-soft);background:repeating-linear-gradient(to top,transparent 0,transparent 52px,rgba(83,126,155,.09) 53px)}
.chart-column{position:relative;display:flex;flex:1;height:100%;min-width:0;align-items:center;justify-content:flex-end;flex-direction:column;gap:7px}.chart-column i{display:block;width:min(46px,62%);height:var(--bar-height);min-height:4px;border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,#52d5ff,var(--kf-blue-2));box-shadow:0 0 22px rgba(17,185,255,.14)}.chart-column small{color:#8099ad;font-size:11px;font-weight:750}.chart-value{position:absolute;bottom:calc(var(--bar-height) + 24px);max-width:72px;color:#acc2d2;font-size:10px;white-space:nowrap;transform:rotate(-36deg);transform-origin:left center}
.quick-links{display:grid;gap:9px;margin-top:12px}.quick-links a{display:flex;align-items:center;gap:12px;padding:11px;border:1px solid var(--kf-line-soft);border-radius:11px;background:#0a1926;color:#e7f5ff;text-decoration:none;transition:.18s}.quick-links a:hover{border-color:#28729a;background:#0d2131;transform:translateX(2px)}.quick-links a>b{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:9px;background:#102b3e;color:#55d2ff;font-size:18px}.quick-links a>span{display:grid;font-size:13px;font-weight:750}.quick-links small{margin-top:2px;color:#6e8ba1;font-size:11px;font-weight:500}

/* Split login inspired by the reference, branded as KeyFlow. */
body.keyflow-login{min-height:100vh;min-height:100dvh;margin:0;background:#07111c;color:var(--kf-text)}
.auth-shell{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr);width:100%;min-height:100vh;min-height:100dvh}
.auth-showcase{position:relative;display:flex;min-width:0;padding:clamp(34px,5vw,76px);flex-direction:column;justify-content:space-between;overflow:hidden;background:radial-gradient(circle at 38% 42%,rgba(22,182,255,.19),transparent 34%),linear-gradient(145deg,#050c13 0%,#071727 60%,#06101a 100%)}
.auth-showcase:before{content:'';position:absolute;inset:0;background:linear-gradient(rgba(61,174,224,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(61,174,224,.05) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,transparent,#000 24%,#000 76%,transparent)}
.auth-showcase:after{content:'';position:absolute;right:-160px;bottom:-210px;width:520px;height:520px;border:1px solid rgba(69,198,255,.17);border-radius:50%;box-shadow:0 0 0 70px rgba(36,139,195,.035),0 0 0 140px rgba(36,139,195,.025)}
.keyflow-login-logo{position:relative;z-index:1;width:min(620px,82%);height:auto;object-fit:contain;object-position:left center;filter:drop-shadow(0 16px 40px rgba(25,177,244,.14))}
.auth-showcase-copy{position:relative;z-index:1;max-width:660px;margin-top:40px}.auth-showcase-copy .eyebrow{color:#4dccff;font-size:11px;font-weight:850;letter-spacing:.18em}.auth-showcase-copy h1{margin:15px 0 12px;color:#f3f9fd;font-size:clamp(44px,5.6vw,82px);line-height:.92;letter-spacing:-.055em}.auth-showcase-copy h1 em{color:#27bfff;font-style:normal;text-shadow:0 0 30px rgba(17,185,255,.25)}.auth-showcase-copy p{max-width:540px;color:#9bb2c3;font-size:clamp(15px,1.4vw,19px);line-height:1.65}.auth-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.auth-points span{padding:8px 11px;border:1px solid #23445d;border-radius:999px;background:rgba(8,28,42,.76);color:#8dcdea;font-size:11px;font-weight:700;letter-spacing:.04em}
.auth-panel{display:flex;align-items:center;justify-content:center;padding:30px;background:linear-gradient(180deg,#0b1723,#07111c);border-left:1px solid #193247}
body.keyflow-login .auth{width:min(420px,100%);margin:0;padding:34px;border:1px solid #213d53;border-radius:18px;background:linear-gradient(155deg,rgba(17,34,50,.98),rgba(9,23,35,.98));box-shadow:var(--kf-shadow);text-align:left}
body.keyflow-login .auth:after{content:'KeyFlow Beta · Core 2.4.27';border-top-color:#20394c;color:#617d91}
.auth-welcome{display:flex;align-items:center;gap:13px;margin-bottom:26px}.keyflow-mark{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border:1px solid #55d2ff;border-radius:13px;background:linear-gradient(145deg,var(--kf-blue-2),var(--kf-blue));color:white;font-weight:900;letter-spacing:-.04em;box-shadow:0 10px 28px rgba(8,120,238,.28)}.auth-welcome small{display:block;margin-bottom:4px;color:#5fcfff;font-size:10px;font-weight:850;letter-spacing:.14em}.auth-welcome h2{margin:0;color:#f2f8fc;font-size:22px;letter-spacing:-.03em}
body.keyflow-login .auth label{color:#9db2c1;font-size:13px;font-weight:700}body.keyflow-login .auth input{min-height:48px;margin-top:7px;background:#081521;border-color:#28465d;color:#fff;border-radius:10px}body.keyflow-login .auth button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:49px;margin-top:8px;padding:12px 16px;border-radius:10px;background:linear-gradient(135deg,var(--kf-blue-2),var(--kf-blue));color:#fff;font-weight:800;box-shadow:0 10px 28px rgba(8,120,238,.24)}.auth-note{margin:18px 0 0;color:#577287;font-size:11px;text-align:center;letter-spacing:.06em}

@media(max-width:1180px){.keyflow-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}.dashboard-grid{grid-template-columns:1fr}.quick-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.auth-shell{grid-template-columns:1fr}.auth-showcase{min-height:310px;padding:28px}.keyflow-login-logo{width:min(500px,86%)}.auth-showcase-copy{margin-top:22px}.auth-showcase-copy h1{font-size:46px}.auth-showcase-copy p{margin-bottom:0}.auth-panel{padding:24px;border-left:0;border-top:1px solid #193247}.keyflow-brand{height:92px!important}.dashboard-intro{align-items:flex-start;flex-direction:column}.keyflow-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:600px){.auth-showcase{min-height:250px;padding:22px}.keyflow-login-logo{width:100%}.auth-showcase-copy .eyebrow,.auth-points{display:none}.auth-showcase-copy h1{margin-top:0;font-size:38px}.auth-showcase-copy p{font-size:14px;line-height:1.5}.auth-panel{padding:16px}.keyflow-login .auth{padding:24px 20px}.dashboard-actions{width:100%}.dashboard-actions .btn{flex:1}.keyflow-cards{grid-template-columns:1fr 1fr!important}.keyflow-cards article{min-height:132px;padding:14px!important}.keyflow-cards strong{font-size:20px!important}.dashboard-grid{gap:12px}.quick-links{grid-template-columns:1fr}.sales-chart{height:220px;padding-left:0;padding-right:0}.chart-column{gap:5px}.chart-column i{width:52%}.chart-value{display:none}body.keyflow-app .content>header{align-items:start}.page-eyebrow{font-size:9px}}
@media(max-width:390px){.keyflow-cards{grid-template-columns:1fr!important}.keyflow-cards article{min-height:116px}.auth-showcase-copy h1{font-size:34px}}
@media print{body.keyflow-app{background:#fff}.nav-caption,.page-eyebrow,.dashboard-actions{display:none!important}}

/* KeyFlow v2.5.1 visual polish. */
body.keyflow-app aside{display:flex;min-height:100vh;height:100vh;flex-direction:column;overflow:hidden}
.keyflow-brand{height:96px!important;min-height:96px!important;padding:7px 8px 11px!important}
.keyflow-brand img{width:112%!important;max-width:none!important;height:82px!important;transform:scale(1.05)}
body.keyflow-app aside nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:8px;scrollbar-width:thin;scrollbar-color:#28485f transparent}
body.keyflow-app aside nav a{min-height:40px;margin:2px 0;padding-top:8px;padding-bottom:8px}
body.keyflow-app aside .profile{flex:0 0 auto;margin-bottom:10px;padding:11px 13px}
body.keyflow-app aside .profile a{margin-top:8px;padding-top:8px}
body.keyflow-app .profile:after{margin-top:7px;font-size:10px}
body.keyflow-app .language-box{margin-top:7px}
body.keyflow-app .language-box label{font-size:10px}
body.keyflow-app .language-box select{min-height:34px;padding:6px 8px;font-size:12px}
.branch-switcher:before,.branch-switcher label:before,.branch-switcher label:after{content:none!important;display:none!important}
.branch-switcher label>span{display:block!important;margin-bottom:5px!important}
.keyflow-cards{grid-template-columns:1.16fr repeat(4,minmax(0,1fr))!important}
.sales-chart{height:218px}
.chart-value{display:none;z-index:5;left:50%;bottom:auto;top:-5px;padding:5px 7px;border:1px solid #2b5873;border-radius:6px;background:#06121d;color:#c9eafd;transform:translate(-50%,-100%);box-shadow:0 8px 20px #0008}
.chart-column:hover .chart-value,.chart-column:focus-within .chart-value{display:block}
.chart-column i{min-height:5px}
.performance-panel{min-height:330px}
@media(max-width:1180px){.keyflow-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:900px){body.keyflow-app aside{height:100vh;height:100dvh}.keyflow-brand img{width:106%!important;transform:none}.keyflow-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:600px){.sales-chart{height:190px}.performance-panel{min-height:290px}.chart-column:hover .chart-value{display:none}}
@media(max-width:390px){.keyflow-cards{grid-template-columns:1fr!important}}

/* iPad/tablet touch layout: use a scrollable drawer in portrait and landscape. */
@media (hover:none) and (pointer:coarse) and (min-width:601px) and (max-width:1366px){
 html,body{max-width:100%;overflow-x:hidden}
 aside{position:fixed;inset:0 auto 0 0;width:min(310px,82vw);height:100vh;height:100dvh;z-index:30;transform:translateX(-105%);transition:transform .22s ease;padding:18px 14px 12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:18px 0 45px #0008}
 body.open aside{transform:translateX(0)}
 aside .brand{flex:0 0 auto;height:78px;padding:0 12px 14px 54px}
 aside nav{flex:1 1 auto;min-height:0;display:block;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:2px 4px 16px}
 aside nav a{display:block;min-height:44px;padding:11px 12px;margin-bottom:4px}
 aside .profile{flex:0 0 auto;margin-top:0;max-height:36vh;overflow-y:auto;padding:11px 9px;background:#090c10}
 .content{width:100%;max-width:none;margin-left:0;padding:22px}
 .content>header{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:start}
 .content>header .menu{display:inline-grid;place-items:center;position:relative;z-index:32;width:44px;height:44px;margin:0;padding:0;font-size:15px;touch-action:manipulation}
 .content>header>div{min-width:0;padding-left:4px}
 .content>header>form{grid-column:1/-1;width:100%;max-width:none}
 .nav-overlay{display:block;position:fixed;inset:0;z-index:29;background:#000a;opacity:0;visibility:hidden;transition:.2s;touch-action:manipulation}
 body.open .nav-overlay{opacity:1;visibility:visible}
 body.open{overflow:hidden}
 body.open .menu{position:fixed!important;top:18px;left:248px;z-index:34!important;width:44px!important;height:44px!important;padding:0!important;font-size:0!important}
 body.open .menu:after{content:'×';font-size:28px;line-height:1}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .panel,.tablewrap{max-width:100%;min-width:0}
 .tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
 .search-tools,.inventory-search{grid-template-columns:repeat(2,minmax(0,1fr))}
 .search-tools input,.inventory-search input{grid-column:1/-1}
 .content form,.content form .grid,.content form .twocol{min-width:0;max-width:100%}
 .content form .grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:12px;align-items:start}
 .content form .grid>label,.content form label{width:100%;min-width:0;max-width:none}
 .content form .grid>.wide{grid-column:1/-1}
 .content form input,.content form select{width:100%;min-width:0;min-height:46px}
 .content form textarea{width:100%;min-width:0;min-height:92px}
 .content form button,.content form .btn{min-height:44px}
 .inventory-entry-forms{grid-template-columns:repeat(2,minmax(0,1fr))}
}

.receipt-status{display:inline-flex;align-items:center;justify-content:center;min-width:76px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:800;line-height:1.2;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.receipt-status.payment-paid{background:#d9f7e8;color:#087443;border:1px solid #84d9ad}
.receipt-status.payment-pending{background:#ffead1;color:#9a4b00;border:1px solid #efbd78}
.receipt-status.payment-partial{background:#fff4bd;color:#735c00;border:1px solid #dfc858}

/* Final iPad overrides must follow the legacy tablet block. */
@media (hover:none) and (pointer:coarse) and (min-width:768px) and (max-width:1366px){
 .content>header{grid-template-columns:48px minmax(260px,1fr) minmax(190px,260px)}
 .content>header>form{grid-column:3;width:100%;max-width:260px;justify-self:end}
 .content>header>form select{width:100%;max-width:260px}
 .content form .grid,.content form .twocol{grid-template-columns:repeat(2,minmax(260px,1fr))}
}
@media (hover:none) and (pointer:coarse) and (min-width:601px) and (max-width:767px){
 .content>header{grid-template-columns:48px minmax(0,1fr)}
 .content>header>form{grid-column:2;width:min(240px,100%);max-width:240px;justify-self:end}
 .content form .grid,.content form .twocol{grid-template-columns:minmax(0,1fr)}
}