:root{--ink:#17231f;--muted:#78817d;--line:#e9ece9;--paper:#fff;--bg:#f5f7f5;--green:#164b3c;--mint:#dff4e8;--lime:#b7df69;--orange:#ef7d45;--red:#dc5d51;--shadow:0 12px 35px rgba(26,45,37,.07)}*{box-sizing:border-box}body{margin:0;font-family:'IBM Plex Sans Thai',sans-serif;color:var(--ink);background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.eyebrow{font:700 11px Manrope,sans-serif;letter-spacing:.16em;color:#477869;margin:0 0 8px}.muted{color:var(--muted);margin:4px 0}.auth-shell{min-height:100vh;display:grid;grid-template-columns:48% 52%;background:#f8faf8}.brand-panel{background:var(--green);position:relative;overflow:hidden;padding:55px 70px;color:#fff;display:flex;flex-direction:column;justify-content:space-between}.brand-panel:before,.brand-panel:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.12);width:520px;height:520px;right:-190px;bottom:-180px}.brand-panel:after{width:360px;height:360px;right:-90px;bottom:-90px}.brand-mark{width:42px;height:42px;border-radius:12px;background:var(--lime);color:var(--green);display:grid;place-items:center;font:800 14px Manrope}.brand-copy{position:relative;z-index:1;max-width:520px}.brand-copy .eyebrow{color:var(--lime)}.brand-copy h1{font-size:clamp(52px,6vw,88px);line-height:1.02;letter-spacing:-.05em;margin:16px 0 28px}.brand-copy>p:last-child{font-size:18px;line-height:1.7;color:#c8d9d3;max-width:430px}.mini-preview{width:310px;padding:20px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);backdrop-filter:blur(10px);border-radius:18px;position:relative;z-index:1}.mini-preview>div:first-child{display:flex;justify-content:space-between}.mini-preview strong{color:var(--lime)}.wave{display:flex;align-items:flex-end;height:50px;gap:8px;margin-top:14px}.wave i{display:block;background:rgba(183,223,105,.75);width:24px;border-radius:4px 4px 0 0}.wave i:nth-child(1){height:30%}.wave i:nth-child(2){height:55%}.wave i:nth-child(3){height:42%}.wave i:nth-child(4){height:80%}.wave i:nth-child(5){height:65%}.wave i:nth-child(6){height:92%}.wave i:nth-child(7){height:70%}.wave i:nth-child(8){height:100%}.auth-panel{display:grid;place-items:center;padding:48px}.auth-box{width:min(430px,100%)}.mobile-logo{display:none}.auth-tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:46px}.tab{flex:1;border:0;background:none;padding:13px;color:#919995;border-bottom:2px solid transparent}.tab.active{color:var(--green);font-weight:700;border-color:var(--green)}.auth-form{display:flex;flex-direction:column;gap:21px}.auth-form h2{font-size:36px;letter-spacing:-.03em;margin:0}.auth-form label,.setup-card label,.modal label{font-size:13px;font-weight:600;display:flex;flex-direction:column;gap:8px}.auth-form input,.setup-card input,.modal input,.modal select{height:50px;border:1px solid #dfe4e1;border-radius:10px;padding:0 15px;background:#fff;outline:none}.auth-form input:focus,.setup-card input:focus,.modal input:focus,.modal select:focus{border-color:#44806c;box-shadow:0 0 0 3px #e5f1ed}.form-row{display:flex;justify-content:space-between}.check{flex-direction:row!important;align-items:center;gap:7px!important;font-weight:400!important}.link-btn,.text-btn{border:0;background:transparent;color:#286a55;font-weight:600}.primary-btn,.add-btn{border:0;border-radius:10px;background:var(--green);color:#fff;font-weight:700;padding:14px 18px;display:flex;align-items:center;justify-content:center;gap:12px}.primary-btn span{margin-left:auto}.demo-hint{font-size:12px;color:#9aa19e;text-align:center}.app-shell{display:flex;min-height:100vh}.sidebar{width:244px;position:fixed;inset:0 auto 0 0;background:#133e33;color:#fff;padding:28px 18px 20px;display:flex;flex-direction:column;z-index:10}.logo{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;padding:0 10px 28px}.logo b{font:700 18px Manrope}.logo small{display:block;font:600 8px Manrope;letter-spacing:.18em;color:#83a69a}.sidebar nav{flex:1}.sidebar nav>p{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#6f9588;margin:22px 12px 8px}.nav-item{width:100%;border:0;border-radius:9px;background:transparent;color:#a8c1b9;text-align:left;padding:11px 13px;margin:3px 0;display:flex;align-items:center;gap:12px}.nav-item span{font-size:20px;width:20px;text-align:center}.nav-item.active,.nav-item:hover{background:#205346;color:#fff}.nav-item b{margin-left:auto;background:var(--orange);font-size:10px;padding:2px 6px;border-radius:8px}.sync-card{border-top:1px solid rgba(255,255,255,.1);padding:17px 10px;display:flex;gap:10px;align-items:center}.sync-card>i,.connection-status i{width:8px;height:8px;background:#74d995;border-radius:50%;box-shadow:0 0 0 4px rgba(116,217,149,.12)}.sync-card div{display:flex;flex-direction:column}.sync-card strong{font-size:11px}.sync-card small{font-size:10px;color:#799d91}.profile{border:0;background:#0e342b;color:#fff;border-radius:10px;padding:10px;display:flex;align-items:center;gap:9px;text-align:left}.profile>span{background:#e5ba7a;color:#3e2c14;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-weight:700}.profile div{display:flex;flex-direction:column;flex:1}.profile b{font-size:11px}.profile small{font-size:9px;color:#81a296}.workspace{margin-left:244px;width:calc(100% - 244px)}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:sticky;top:0;z-index:8}.search{width:420px;height:40px;background:#f5f7f5;border-radius:9px;display:flex;align-items:center;padding:0 13px;color:#909894}.search input{border:0;outline:0;background:transparent;flex:1;padding:0 10px}.search kbd{font-size:10px;border:1px solid #d8dedb;border-radius:5px;padding:2px 6px;background:#fff}.top-actions{display:flex;align-items:center;gap:12px}.live{font:700 10px Manrope;color:#438269;background:#eaf7f0;padding:7px 10px;border-radius:20px}.live i{display:inline-block;width:6px;height:6px;background:#54b981;border-radius:50%;margin-right:4px;animation:pulse 1.5s infinite}@keyframes pulse{50%{opacity:.3}}.icon-btn{border:1px solid var(--line);background:#fff;width:39px;height:39px;border-radius:9px;position:relative}.icon-btn b{position:absolute;width:6px;height:6px;background:var(--orange);border-radius:50%;right:8px;top:7px}.menu-btn{display:none}.add-btn{padding:10px 16px}.content{padding:30px 34px 60px;max-width:1500px;margin:auto}.page{display:none}.page.active{display:block}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:25px}.page-heading h2{font-size:28px;letter-spacing:-.02em;margin:0}.date-chip{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;padding:8px 13px;border-radius:10px}.date-chip>span{font-size:20px;color:#477869}.date-chip div{display:flex;flex-direction:column}.date-chip small{font-size:9px;color:var(--muted)}.date-chip strong{font-size:11px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:17px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:19px;display:flex;gap:14px;align-items:flex-start;box-shadow:0 5px 14px rgba(20,60,48,.025)}.stat-icon{width:43px;height:43px;border-radius:10px;background:#e9f4ef;color:#21624e;display:grid;place-items:center;font-size:21px}.stat-card.orange .stat-icon{background:#fff0e8;color:var(--orange)}.stat-card.red .stat-icon{background:#fdecea;color:var(--red)}.stat-body{flex:1}.stat-body small{display:block;color:var(--muted);font-size:11px}.stat-body strong{font:700 26px Manrope;letter-spacing:-.04em}.stat-meta{font-size:10px;color:#4c966e;display:block;margin-top:5px}.stat-meta.warn{color:var(--orange)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.75fr);gap:17px;margin-bottom:17px}.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.card-head{padding:19px 21px 13px;display:flex;justify-content:space-between;align-items:flex-start}.card-head h3,.setup-card h3,.guide-card h3{font-size:15px;margin:0}.card-head p{font-size:10px;color:var(--muted);margin:4px 0}.legend{display:flex;gap:12px;font-size:10px;color:var(--muted)}.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}.legend .in{background:#9fd3bd}.legend .out{background:#ef8a55}.chart{height:245px;padding:10px 18px 18px;display:flex;align-items:flex-end;gap:13px;border-top:1px solid #f3f4f3}.chart-day{flex:1;text-align:center;height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:7px}.bars{height:190px;display:flex;gap:4px;align-items:flex-end;justify-content:center;border-bottom:1px solid #e7ebe8;background:repeating-linear-gradient(to top,transparent 0,transparent 46px,#f1f3f1 47px)}.bar{width:min(18px,35%);border-radius:4px 4px 1px 1px;transition:height .5s}.bar.in{background:#9fd3bd}.bar.out{background:#ef8a55}.chart-day small{font-size:9px;color:var(--muted)}.alert-list{padding:0 17px 11px}.alert-item{display:grid;grid-template-columns:39px 1fr auto;gap:10px;align-items:center;border-top:1px solid #f0f2f0;padding:12px 3px}.product-thumb{width:39px;height:39px;border-radius:9px;background:var(--thumb,#e8f1ed);display:grid;place-items:center;font-size:18px}.alert-item b{display:block;font-size:11px}.alert-item small{font-size:9px;color:var(--muted)}.stock-count{text-align:right}.stock-count strong{color:var(--red);font:700 14px Manrope}.stock-count small{display:block}.table-card{overflow:hidden}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:#8c9591;background:#fafbfa;padding:11px 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}td{padding:12px 20px;border-bottom:1px solid #f0f2f0;font-size:11px}tr:last-child td{border-bottom:0}.product-cell{display:flex;align-items:center;gap:10px}.product-cell b{display:block}.product-cell small{color:var(--muted)}.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:12px;font-size:9px;font-weight:600}.pill.in,.pill.done,.pill.normal{background:#e8f5ee;color:#2d795b}.pill.out{background:#fff0e8;color:#c95d29}.pill.low,.pill.returned{background:#fdecea;color:#bb4d44}.pill.pending{background:#fff6df;color:#9b731a}.filterbar{padding:16px 20px;display:flex;gap:10px}.filterbar input,.filterbar select{border:1px solid var(--line);height:39px;padding:0 12px;border-radius:8px;background:#fff;min-width:190px}.settings-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.setup-card,.guide-card{padding:28px}.sheet-icon{width:55px;height:55px;border-radius:14px;background:#e7f5ed;color:#267052;display:grid;place-items:center;font-size:27px;margin-bottom:20px}.setup-card>p,.guide-card>p{color:var(--muted);font-size:12px;line-height:1.7}.setup-card label{margin-top:22px}.button-row{display:flex;gap:10px;margin-top:15px}.secondary-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 16px}.connection-status{display:flex;align-items:center;gap:10px;margin-top:20px;background:#f6f8f6;padding:12px;border-radius:8px;font-size:11px}.schema{display:flex;flex-direction:column;gap:7px;margin:20px 0}.schema b{font-size:11px;margin-top:5px}.schema code{font-size:10px;background:#f4f6f4;padding:10px;border-radius:7px;white-space:normal}.guide-card a{font-size:11px;color:#247055;font-weight:700}.modal{border:0;border-radius:16px;padding:0;box-shadow:0 30px 80px rgba(0,0,0,.22);width:min(480px,calc(100% - 30px))}.modal::backdrop{background:rgba(8,28,23,.55);backdrop-filter:blur(3px)}.modal form{padding:25px;display:flex;flex-direction:column;gap:18px}.modal-head{display:flex;justify-content:space-between}.modal-head h3{margin:0}.modal-head button{border:0;background:#f1f3f1;width:32px;height:32px;border-radius:8px;font-size:20px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.toast{position:fixed;z-index:100;right:25px;bottom:25px;background:#163f34;color:#fff;padding:13px 18px;border-radius:10px;box-shadow:var(--shadow);font-size:12px;transform:translateY(100px);opacity:0;transition:.3s}.toast.show{transform:none;opacity:1}
@media(max-width:1050px){.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.brand-panel{padding:45px}.settings-grid{grid-template-columns:1fr}}
@media(max-width:760px){.auth-shell{grid-template-columns:1fr}.brand-panel{display:none}.auth-panel{padding:30px 22px}.mobile-logo{display:flex;align-items:center;gap:10px;margin-bottom:35px}.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none;box-shadow:20px 0 60px rgba(0,0,0,.2)}.workspace{margin-left:0;width:100%}.topbar{padding:0 14px}.menu-btn{display:block}.search{width:auto;flex:1;margin:0 10px}.search kbd,.top-actions .icon-btn,.live{display:none}.content{padding:22px 14px 45px}.page-heading{align-items:flex-start}.date-chip{display:none}.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stat-card{padding:14px;gap:9px}.stat-icon{width:35px;height:35px}.stat-body strong{font-size:20px}.dashboard-grid{grid-template-columns:1fr}.chart{gap:4px}.alert-card{min-width:0}.add-btn{font-size:11px}.page-heading h2{font-size:23px}.filterbar{flex-direction:column}.filterbar input,.filterbar select{width:100%}.settings-grid{grid-template-columns:1fr}.setup-card,.guide-card{padding:20px}.button-row{flex-direction:column}.top-actions .add-btn{padding:10px;font-size:0}.top-actions .add-btn:first-letter{font-size:18px}}
@media(max-width:420px){.stats-grid{grid-template-columns:1fr}.auth-panel{padding:22px}.auth-tabs{margin-bottom:34px}.two-col{grid-template-columns:1fr}}

/* monstock — blue data-infographic theme */
:root{--ink:#17253d;--muted:#7e91aa;--line:#dce5f1;--paper:#fff;--bg:#f5f8fd;--green:#315f9f;--mint:#e4eefb;--lime:#77b8e8;--orange:#4f96cf;--red:#315f9f;--shadow:none}
body{background:var(--bg);color:var(--ink)}
.brand-panel{background:#eef4fc;color:var(--ink);border-right:1px solid #d6e1ef}
.brand-panel:before,.brand-panel:after{border-color:#bfd1e8}
.brand-copy .eyebrow{color:#4b8cc4}.brand-copy>p:last-child{color:#68809f}
.brand-mark{border-radius:50%;background:linear-gradient(135deg,#274d8a 0 48%,#75b9e9 49% 76%,#a9c7e8 77%);color:#fff;text-transform:lowercase;box-shadow:0 0 0 5px #e1eaf6}
.mini-preview{border-color:#c9d8ea;background:rgba(255,255,255,.52)}.mini-preview strong{color:#3979b4}.wave i{background:#70addd}
.auth-shell{background:#fbfcff}.tab.active{color:#315f9f;border-color:#315f9f}.auth-form input:focus,.setup-card input:focus,.modal input:focus,.modal select:focus{border-color:#6ea9d9;box-shadow:0 0 0 3px #e7f1fa}.link-btn,.text-btn{color:#3c7db7}.primary-btn,.add-btn{background:#315f9f;border-radius:4px}
.sidebar{background:#f8fbff;color:var(--ink);border-right:1px solid #d8e3f0}.logo{color:var(--ink);border-bottom:1px solid var(--line)}.logo b{text-transform:lowercase}.logo small{color:#7f96b3}.sidebar nav>p{color:#9aabc0}.nav-item{color:#66809e;border-radius:3px}.nav-item.active,.nav-item:hover{background:#dfeaf7;color:#234d86;border-left:3px solid #397cc0}.nav-item b{background:#4d95ce;color:white}.sync-card{border-color:var(--line)}.sync-card>i,.connection-status i{background:#69a9da;box-shadow:0 0 0 4px #e0eef9}.sync-card strong{color:#385f8c}.sync-card small{color:#8ba0b7}.profile{background:#e8f0fa;color:var(--ink);border:1px solid #d6e2ef;border-radius:3px}.profile>span{background:#79afe0;color:white}.profile small{color:#7b91aa}
.topbar{background:#fbfdff;border-color:#dbe5f0}.search{background:#eef3f9;border:1px solid #e0e8f2}.live{color:#306eaa;background:#e0eef9}.live i{background:#4a95cc}.content{max-width:1540px}.page-heading{padding-bottom:18px;border-bottom:1px solid #bfcddd}.page-heading h2{font-size:31px}.eyebrow{color:#4d8ec5}.date-chip,.card,.stat-card{border-radius:2px;box-shadow:none}.date-chip{border-color:#cad8e8}.date-chip>span{color:#4c8dc6}
.stats-grid{gap:0;border-top:1px solid #c9d6e5;border-bottom:1px solid #c9d6e5;background:#f8fbff}.stat-card{border:0;border-right:1px solid #d8e2ee;background:transparent;padding:22px 20px;align-items:center}.stat-card:last-child{border-right:0}.stat-icon,.stat-card.orange .stat-icon,.stat-card.red .stat-icon{width:66px;height:66px;flex:0 0 66px;border-radius:50%;background:conic-gradient(#397cc0 0 68%,#dce6f3 68% 100%);color:#315f9f;border:9px solid #edf3fa;outline:2px solid #87b5dd;font-size:17px}.stat-card:nth-child(2) .stat-icon{background:conic-gradient(#6aabe0 0 52%,#dce6f3 52%)}.stat-card:nth-child(3) .stat-icon{background:conic-gradient(#315f9f 0 36%,#dce6f3 36%)}.stat-card:nth-child(4) .stat-icon{background:conic-gradient(#8abce5 0 24%,#dce6f3 24%)}.stat-body strong{color:#315f9f}.stat-meta,.stat-meta.warn{color:#6f91b3}
.card{border-color:#cfdbe9}.card-head{border-bottom:1px solid #e1e8f1}.legend .in,.bar.in{background:#80b9e4}.legend .out,.bar.out{background:#315f9f}.chart{border-top:0}.bars{border-color:#cad7e6;background:repeating-linear-gradient(to top,transparent 0,transparent 46px,#e7edf5 47px)}.bar{border-radius:0}.alert-item{border-color:#e1e8f1}.product-thumb{border-radius:50%;filter:saturate(.35)}.stock-count strong{color:#315f9f}
th{background:#edf3fa;color:#607b9c;border-color:#d7e1ed}td{border-color:#e5ebf3}.pill{border-radius:2px}.pill.in,.pill.done,.pill.normal{background:#e0eef9;color:#326f9f}.pill.out{background:#dce8f7;color:#284f88}.pill.low,.pill.returned{background:#cfdef1;color:#244d86}.pill.pending{background:#edf3fa;color:#54789e}.filterbar input,.filterbar select,.secondary-btn{border-radius:2px}.sheet-icon{border-radius:50%;background:#e0eef9;color:#3478b1}.connection-status,.schema code{background:#edf3f9}.guide-card a{color:#397cb6}.modal{border-radius:3px}.modal::backdrop{background:rgba(28,52,84,.55)}.modal-head button{border-radius:2px;background:#e7eef7}.toast{background:#315f9f;border-radius:2px}
@media(max-width:760px){.stats-grid{gap:1px;background:#d8e2ee}.stat-card{background:#f8fbff;border:0}.brand-panel{border:0}}
.template-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0}.template-actions a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:9px 12px;text-decoration:none;font-size:11px;font-weight:700;border:1px solid #315f9f}.template-download{background:#315f9f;color:#fff!important}.template-open{background:#eef4fb;color:#315f9f!important}@media(max-width:420px){.template-actions{grid-template-columns:1fr}}

/* monstock — bold minimal blue redesign */
:root{--ink:#090e1c;--muted:#697386;--line:#e8ebf1;--paper:#fff;--bg:#fff;--green:#0a43f5;--mint:#eff3ff;--lime:#0a43f5;--orange:#0a43f5;--red:#0a43f5;--shadow:0 12px 38px rgba(25,45,90,.06)}
body{background:#fff;color:var(--ink)}.brand-lockup{display:block;width:185px;height:auto}.brand-panel>.brand-lockup{position:relative;z-index:2;width:210px}.mobile-logo .brand-lockup{width:190px}
.brand-panel{background:#fff;border-right:1px solid #eef0f4;padding:48px 64px}.brand-panel:before{width:128px;height:128px;border:0;border-radius:0;right:45px;top:38px;bottom:auto;background-image:radial-gradient(#0a43f5 2px,transparent 2px);background-size:20px 20px;opacity:.9}.brand-panel:after{width:100%;height:8px;border:0;border-radius:0;background:#0a43f5;bottom:0;left:0;right:auto}.brand-copy{max-width:550px}.brand-copy .eyebrow{display:none}.brand-copy h1{font-family:Manrope,'IBM Plex Sans Thai',sans-serif;font-size:clamp(58px,6.5vw,92px);line-height:.96;letter-spacing:-.065em;text-transform:uppercase;margin:0 0 30px;max-width:520px}.brand-copy h1::first-line{color:#090e1c}.brand-copy>p:last-child{color:#2e374a;font-size:19px;max-width:390px;border-left:5px solid #0a43f5;padding-left:18px}.mini-preview{width:360px;border:1px solid #e6e9f0;border-radius:14px;background:#fff;box-shadow:var(--shadow)}.mini-preview strong{color:#0a43f5}.wave i{background:#0a43f5}.wave i:nth-child(even){background:#7999ff}
.auth-panel{background:#fafbfe}.auth-tabs{border-color:#e4e8ef}.tab.active{color:#0a43f5;border-color:#0a43f5}.auth-form h2{font-family:Manrope,'IBM Plex Sans Thai',sans-serif;font-weight:800;font-size:42px}.auth-form input,.setup-card input,.modal input,.modal select{border-radius:7px;border-color:#dfe3eb}.auth-form input:focus,.setup-card input:focus,.modal input:focus,.modal select:focus{border-color:#0a43f5;box-shadow:0 0 0 3px #e7edff}.primary-btn,.add-btn{background:#0a43f5;border-radius:7px;box-shadow:0 8px 18px rgba(10,67,245,.18)}.link-btn,.text-btn{color:#0a43f5}
.sidebar{background:#fff;border-right:1px solid #e9ecf2;width:250px;padding:26px 18px 20px}.sidebar .logo{padding:0 8px 24px}.sidebar .brand-lockup{width:175px}.sidebar nav>p{color:#a1a8b5}.nav-item{color:#697386;border-radius:7px;font-weight:500}.nav-item.active,.nav-item:hover{background:#eef2ff;color:#0a43f5;border-left:0}.nav-item.active span{color:#0a43f5}.nav-item b{background:#0a43f5}.sync-card{border-color:#eaedf3}.sync-card>i,.connection-status i{background:#0a43f5;box-shadow:0 0 0 4px #e8edff}.sync-card strong{color:#172038}.profile{background:#f7f8fb;color:#111827;border-color:#eaedf2;border-radius:8px}.profile>span{background:#0a43f5;color:#fff}.profile small{color:#7d8797}.workspace{margin-left:250px;width:calc(100% - 250px)}
.topbar{background:rgba(255,255,255,.94);border-color:#eceef3;backdrop-filter:blur(14px)}.search{background:#f7f8fa;border-color:#eceef2}.live{background:#ebf0ff;color:#0a43f5}.live i{background:#0a43f5}.content{max-width:1480px;padding-top:38px}.page-heading{border:0;padding:0;margin-bottom:28px;position:relative}.page-heading:after{content:"";position:absolute;width:72px;height:5px;background:#0a43f5;left:0;bottom:-13px;border-radius:8px}.page-heading h2{font-family:Manrope,'IBM Plex Sans Thai',sans-serif;font-size:36px;font-weight:800;letter-spacing:-.04em}.eyebrow{color:#0a43f5}.date-chip{border-radius:8px}.date-chip>span{color:#0a43f5}
.stats-grid{gap:15px;border:0;background:transparent}.stat-card{border:1px solid #e9ecf2!important;border-radius:12px;background:#fff;padding:20px;box-shadow:0 8px 26px rgba(28,45,80,.045);position:relative;overflow:hidden}.stat-card:first-child{background:linear-gradient(135deg,#0737da,#0a54ff);border-color:#0a43f5!important;color:#fff}.stat-card:first-child:after{content:"";position:absolute;width:150px;height:150px;border:1px solid rgba(255,255,255,.2);border-radius:50%;right:-48px;top:-65px}.stat-card:first-child .stat-body small,.stat-card:first-child .stat-meta{color:#dfe8ff}.stat-card:first-child .stat-body strong{color:#fff}.stat-icon,.stat-card.orange .stat-icon,.stat-card.red .stat-icon{width:54px;height:54px;flex-basis:54px;border:0;outline:0;border-radius:50%;background:#eef2ff;color:#0a43f5;font-size:20px}.stat-card:first-child .stat-icon{background:rgba(255,255,255,.15);color:#fff}.stat-card:nth-child(n+2) .stat-icon{background:#f0f3ff}.stat-body strong{color:#0a43f5;font-size:29px}.stat-meta,.stat-meta.warn{color:#52617a}
.card{border:1px solid #e8ebf1;border-radius:12px;box-shadow:0 10px 32px rgba(22,43,85,.05)}.card-head{border-color:#edf0f4;padding:21px 23px 15px}.card-head h3,.setup-card h3,.guide-card h3{font-family:Manrope,'IBM Plex Sans Thai',sans-serif;font-size:16px;font-weight:800}.legend .in,.bar.in{background:#87a7ff}.legend .out,.bar.out{background:#0a43f5}.chart{padding-left:23px;padding-right:23px}.bars{background:repeating-linear-gradient(to top,transparent 0,transparent 46px,#edf0f5 47px);border-color:#e5e9f0}.bar{border-radius:5px 5px 0 0}.product-thumb{border-radius:10px;filter:saturate(.55)}.stock-count strong{color:#0a43f5}
th{background:#f7f8fb;color:#7b8494;border-color:#e8ebf0}td{border-color:#edf0f4}.pill{border-radius:20px}.pill.in,.pill.done,.pill.normal{background:#eaf0ff;color:#0a43f5}.pill.out{background:#eef1f8;color:#344766}.pill.low,.pill.returned{background:#e0e7ff;color:#0a43f5}.pill.pending{background:#f0f2f7;color:#4b5d78}.filterbar input,.filterbar select,.secondary-btn{border-radius:7px}.sheet-icon{border-radius:12px;background:#eaf0ff;color:#0a43f5}.connection-status,.schema code{background:#f7f8fb}.guide-card a{color:#0a43f5}.template-actions a{border-color:#0a43f5;border-radius:7px}.template-download{background:#0a43f5}.template-open{background:#eef2ff}.modal{border-radius:12px}.modal::backdrop{background:rgba(8,17,40,.6)}.toast{background:#0a43f5;border-radius:8px}
@media(max-width:760px){.workspace{margin-left:0;width:100%}.stats-grid{background:transparent;gap:10px}.brand-panel{display:none}.sidebar{width:250px}.stat-card{background:#fff}.stat-card:first-child{background:linear-gradient(135deg,#0737da,#0a54ff)}}
.top-products-card{margin-bottom:17px;overflow:hidden}.top-products-card .card-head{align-items:center}.top-products-card .eyebrow{font-size:9px;margin-bottom:4px}.ranking-summary{text-align:right;background:#eef2ff;padding:9px 14px;border-radius:8px;min-width:130px}.ranking-summary small{display:block;color:#697386;font-size:9px}.ranking-summary strong{display:block;color:#0a43f5;font:800 17px Manrope}.top-products-list{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;padding:5px 22px 18px}.top-product-row{display:grid;grid-template-columns:31px 39px 1fr;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f4}.top-product-row:nth-last-child(-n+2){border-bottom:0}.rank{font:700 11px Manrope;color:#9aa3b2;text-align:center}.rank-1,.rank-2,.rank-3{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#0a43f5;color:#fff}.rank-2{background:#4773f4}.rank-3{background:#7b98ee}.top-product-info{display:grid;grid-template-columns:1fr auto;gap:2px 12px;min-width:0}.top-product-info b{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-product-info small{display:block;color:#8a94a4;font-size:9px}.top-product-value{text-align:right;grid-row:1 / 3;grid-column:2}.top-product-value strong{font:800 17px Manrope;color:#0a43f5}.top-product-value small{margin-left:3px}.ranking-track{grid-column:1 / 3;height:4px;background:#eef1f6;border-radius:8px;overflow:hidden;margin-top:5px}.ranking-track i{display:block;height:100%;background:linear-gradient(90deg,#8aa5ff,#0a43f5);border-radius:8px}.empty-ranking{grid-column:1/-1;text-align:center;color:#8b95a5;padding:25px}@media(max-width:900px){.top-products-list{grid-template-columns:1fr}.top-product-row:nth-last-child(-n+2){border-bottom:1px solid #edf0f4}.top-product-row:last-child{border-bottom:0}}@media(max-width:480px){.top-products-list{padding:5px 14px 15px}.top-product-row{grid-template-columns:28px 34px 1fr}.ranking-summary{display:none}}
.scan-btn{height:40px;border:1px solid #0a43f5;background:#eef2ff;color:#0a43f5;border-radius:7px;padding:0 14px;font-weight:700;font-size:11px}.scan-btn:hover{background:#e2e9ff}.barcode-modal{width:min(540px,calc(100% - 24px))}.barcode-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#f1f3f8;padding:5px;border-radius:9px}.mode-btn{border:0;background:transparent;color:#697386;border-radius:6px;padding:10px;font-weight:700}.mode-btn.active{background:#0a43f5;color:#fff;box-shadow:0 4px 12px rgba(10,67,245,.2)}.barcode-input-wrap{display:grid;grid-template-columns:34px 1fr auto;align-items:center;border:2px solid #dfe4ed;border-radius:8px;overflow:hidden;background:#fff}.barcode-input-wrap:focus-within{border-color:#0a43f5;box-shadow:0 0 0 3px #e7edff}.barcode-input-wrap>span{text-align:center;color:#0a43f5;font-size:20px}.barcode-input-wrap input{border:0!important;box-shadow:none!important;border-radius:0!important;padding:0 5px!important;min-width:0}.barcode-input-wrap button{height:36px;margin-right:6px;border:0;border-radius:5px;background:#eef2ff;color:#0a43f5;font-size:10px;font-weight:700;padding:0 10px}.camera-area{height:240px;background:#081020;border-radius:9px;overflow:hidden;position:relative}.camera-area video{width:100%;height:100%;object-fit:cover}.camera-area:after{content:"";position:absolute;inset:35px 45px;border:2px solid rgba(255,255,255,.8);border-radius:8px;box-shadow:0 0 0 999px rgba(0,0,0,.25)}.camera-area .scan-line{position:absolute;z-index:2;height:2px;background:#0a43f5;box-shadow:0 0 8px #fff;left:50px;right:50px;top:50%;animation:barcodeScan 2s ease-in-out infinite}.camera-area small{position:absolute;z-index:3;bottom:9px;left:0;right:0;text-align:center;color:#fff}@keyframes barcodeScan{0%,100%{transform:translateY(-60px)}50%{transform:translateY(60px)}}.scanned-product{min-height:70px;border:1px solid #dce3ee;background:#f7f9fd;border-radius:9px;padding:12px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:11px}.scanned-product.empty{display:grid;place-items:center;border-style:dashed;color:#8b95a6}.scanned-product b{display:block;font-size:12px}.scanned-product small{display:block;color:#7d8797;font-size:9px}.scan-stock{text-align:right}.scan-stock strong{display:block;color:#0a43f5;font:800 15px Manrope}.scanner-hint{font-size:9px;color:#8a94a4;text-align:center;margin:0}.primary-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}@media(max-width:760px){.top-actions .scan-btn{font-size:0;width:40px;padding:0}.top-actions .scan-btn:first-letter{font-size:18px}}@media(max-width:480px){.camera-area{height:210px}.scanned-product{grid-template-columns:38px 1fr}.scan-stock{grid-column:2;text-align:left;display:flex;gap:5px}.barcode-input-wrap{grid-template-columns:30px 1fr auto}.barcode-input-wrap button{font-size:0;width:35px}.barcode-input-wrap button:first-letter{font-size:15px}}

/* Responsive: tablet and mobile */
.sidebar-backdrop{display:none;position:fixed;inset:0;border:0;background:rgba(8,16,32,.42);backdrop-filter:blur(2px);z-index:9}.sidebar-backdrop.show{display:block}.table-wrap{-webkit-overflow-scrolling:touch;scrollbar-width:thin}.nav-item,.icon-btn,.scan-btn,.add-btn,.mode-btn{touch-action:manipulation}
@media(max-width:1100px){body.nav-open{overflow:hidden}.sidebar{z-index:12;transform:translateX(-102%);transition:transform .25s ease;width:min(300px,84vw);box-shadow:none}.sidebar.open{transform:translateX(0);box-shadow:20px 0 55px rgba(8,20,48,.2)}.workspace{margin-left:0;width:100%}.menu-btn{display:block;flex:0 0 40px}.topbar{padding:0 20px}.search{width:min(390px,45vw)}.content{padding:30px 24px 55px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:minmax(0,1fr)}.settings-grid{grid-template-columns:1fr}.top-products-list{grid-template-columns:1fr 1fr}.auth-shell{grid-template-columns:42% 58%}.brand-panel{padding:38px}.brand-copy h1{font-size:clamp(44px,6vw,68px)}}
@media(min-width:761px) and (max-width:1100px){.sidebar .nav-item{min-height:46px}.topbar{height:68px}.card-head{padding:18px}.chart{height:260px}.table-wrap:after{content:"เลื่อนตารางด้านข้างเพื่อดูข้อมูลเพิ่มเติม →";display:block;padding:8px 18px;color:#929baa;font-size:9px;background:#fafbfc}.modal{max-height:calc(100dvh - 40px);overflow:auto}}
@media(max-width:760px){body{font-size:15px}.topbar{height:62px;padding:0 10px;gap:8px}.menu-btn{width:42px;height:42px}.search{min-width:0;width:auto;flex:1;margin:0}.search input{font-size:12px}.top-actions{gap:6px}.top-actions .add-btn,.top-actions .scan-btn{width:42px;height:42px;padding:0;display:grid;place-items:center}.content{padding:22px 12px 42px}.page-heading{margin-bottom:24px;gap:10px}.page-heading h2{font-size:25px}.page-heading .add-btn{min-height:42px;white-space:nowrap}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{min-width:0;padding:14px 12px}.stat-icon,.stat-card.orange .stat-icon,.stat-card.red .stat-icon{width:42px;height:42px;flex-basis:42px;font-size:16px}.stat-body{min-width:0}.stat-body strong{font-size:21px;white-space:nowrap}.stat-meta{white-space:normal}.dashboard-grid{gap:12px}.card{border-radius:10px}.card-head{padding:16px;gap:10px}.card-head h3{font-size:14px}.chart{height:230px;padding:8px 10px 14px}.bars{height:170px}.alert-list{padding:0 12px 10px}.top-products-list{grid-template-columns:1fr;padding:4px 14px 15px}.top-product-row{grid-template-columns:30px 36px minmax(0,1fr)}.top-product-info{min-width:0}.top-product-info b{max-width:48vw}.table-card{margin-left:0;margin-right:0}.table-wrap{width:100%;overflow-x:auto}.table-wrap table{min-width:760px}.filterbar{padding:13px}.filterbar input,.filterbar select{min-height:44px}.setup-card,.guide-card{padding:18px}.modal{width:100%;max-width:none;max-height:92dvh;margin:auto 0 0;border-radius:16px 16px 0 0;overflow:auto}.modal form{padding:18px 16px calc(18px + env(safe-area-inset-bottom));gap:15px}.modal-head{position:sticky;top:-18px;background:#fff;z-index:4;padding:10px 0}.modal-head button{width:40px;height:40px}.barcode-modal{width:100%}.camera-area{height:min(42dvh,280px)}.toast{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));text-align:center}.auth-panel{min-height:100dvh;padding:24px 20px}.auth-box{width:100%}.auth-form input{font-size:16px}.mobile-logo{margin-bottom:25px}.button-row{gap:8px}.button-row>*{min-height:44px}}
@media(max-width:430px){.stats-grid{grid-template-columns:1fr}.stat-card{min-height:86px}.page-heading{align-items:flex-start}.page-heading>button{padding:10px;font-size:0}.page-heading>button:first-letter{font-size:18px}.legend{flex-direction:column;gap:3px}.top-product-info b{max-width:42vw}.two-col{grid-template-columns:1fr}.template-actions{grid-template-columns:1fr}.scanned-product{grid-template-columns:38px minmax(0,1fr)}.scan-stock{grid-column:2;text-align:left}.barcode-input-wrap input{font-size:16px}.scanner-hint{line-height:1.5}}
@media(orientation:landscape) and (max-height:600px){.modal{max-height:96dvh}.modal form{gap:10px}.camera-area{height:180px}.sidebar{overflow-y:auto}.sync-card{display:none}}

/* Production auth, logout and product image refinements */
.product-thumb img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.product-thumb.image-fallback{display:grid;place-items:center;font-size:18px}
.product-image-field small{display:block;margin-top:6px;color:#788397;font-size:10px;font-weight:500;line-height:1.45}
.product-image-field input[type="file"]{padding:10px;background:#f8faff;cursor:pointer}
.product-image-preview{min-height:104px;display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:14px;padding:10px;border:1px solid #dce3ef;border-radius:10px;background:#f8faff}
.product-image-preview.empty{display:flex;flex-direction:column;justify-content:center;gap:3px;border-style:dashed;color:#8d98aa;text-align:center}
.product-image-preview.empty span{font-size:26px}.product-image-preview p{margin:0;font-size:11px}
.product-image-preview img{width:84px;height:84px;object-fit:cover;border-radius:8px;background:#e8eef7}
.product-image-preview b,.product-image-preview small{display:block;overflow:hidden;text-overflow:ellipsis}
.product-image-preview b{font-size:11px;white-space:nowrap}.product-image-preview small{margin-top:5px;color:#7d8899;font-size:9px;line-height:1.4}
.camera-message{padding:10px 12px;border-radius:8px;background:#f0f4ff;color:#34518d;font-size:10px;line-height:1.5}
.camera-message.loading{background:#fff7df;color:#8a6411}.camera-message.success{background:#eaf8f0;color:#237447}.camera-message.error{background:#fff0ef;color:#aa3d36}
.report-controls{display:flex;align-items:center;gap:14px}.report-controls select{height:34px;border:1px solid #dce3ef;border-radius:8px;background:#fff;color:#24344f;padding:0 10px;font-size:10px;font-weight:700}.chart-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.chart-scroll::-webkit-scrollbar{height:6px}.chart-scroll::-webkit-scrollbar-thumb{background:#cbd6e7;border-radius:5px}.chart{min-width:100%}.chart-day{min-width:24px}
.table-action{white-space:nowrap;border:1px solid #cfdbf7;background:#f3f6ff;color:#1649d8;border-radius:7px;padding:8px 10px;font:700 9px Manrope;cursor:pointer}
.pill.adjust{background:#f1ecff;color:#6540b8}.product-cell+small,td>small{display:block;color:#7b879b;margin-top:3px}.filterbar #productSearch{flex:1;min-width:260px}
.table-action:hover{background:#e8eeff}.form-note{margin:0;padding:9px 11px;border-radius:8px;background:#f3f6ff;color:#65728a;font-size:10px;line-height:1.5}
.logout-button{width:100%;min-height:42px;margin-top:8px;border:1px solid #ffd4d0;background:#fff5f4;color:#b9362d;border-radius:8px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px}
.logout-button:hover{background:#ffe9e7}
@media(max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  .auth-shell{display:block;width:100%;min-height:100dvh}
  .auth-panel{align-items:start;padding:18px 18px calc(24px + env(safe-area-inset-bottom));overflow-y:auto}
  .auth-panel{width:100%;min-width:0;min-height:100dvh}
  .auth-box{width:100%;max-width:520px;margin:0 auto}
  .auth-tabs{position:sticky;top:0;z-index:3;background:#fff;margin-bottom:24px;padding-top:4px}
  .auth-form{gap:15px}
  .auth-form h2{font-size:clamp(27px,8vw,34px);line-height:1.15}
  .auth-form label{font-size:14px}
  .auth-form input{min-height:52px;font-size:16px}
  .auth-form .primary-btn{min-height:52px;font-size:15px}
  .mobile-logo{margin:4px 0 18px}
  .mobile-logo .brand-lockup{width:168px;max-width:62vw}
  .sidebar{padding-bottom:calc(16px + env(safe-area-inset-bottom));overflow-y:auto}
  .profile,.logout-button{flex-shrink:0}
  .product-image-preview{grid-template-columns:72px minmax(0,1fr);min-height:92px}.product-image-preview img{width:72px;height:72px}
  .camera-message{font-size:11px}
  .report-head{flex-direction:column;align-items:stretch}.report-controls{justify-content:space-between;gap:8px}.report-controls select{min-width:92px;height:38px}.chart-scroll{padding-bottom:2px}
}

.approval-card{margin-bottom:18px}.approval-card td b,.approval-card td small{display:block}.approval-card td small{color:#7b879b;margin-top:3px}.approval-actions{display:flex;gap:6px;flex-wrap:wrap}.approval-actions button{border:0;border-radius:8px;padding:7px 10px;background:#e8efff;color:#124be4;font-weight:700;cursor:pointer}.approval-actions button.danger{background:#fff0f0;color:#d32f2f}.pill.rejected,.pill.suspended{background:#fff0f0;color:#c62828}.empty-row{text-align:center;color:#7b879b;padding:24px!important}

/* SaaS team, tenant and RBAC */
.permission-hidden{display:none!important}.tenant-security-note{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;padding:15px 18px;margin-bottom:17px;border:1px solid #cfd9ff;background:#f2f5ff;border-radius:10px}.tenant-security-note>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#0a43f5;color:#fff}.tenant-security-note b{font-size:12px}.tenant-security-note p{font-size:10px;color:#647086;margin:2px 0}.tenant-security-note>strong{font:800 10px Manrope;color:#0a43f5;background:#fff;border:1px solid #cfd9ff;padding:7px 10px;border-radius:20px}.roles-card,.permission-card{margin-bottom:17px}.role-board{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:10px;padding:15px;overflow-x:auto;-webkit-overflow-scrolling:touch}.role-column{background:#f7f8fb;border:1px solid #e5e9f0;border-top:3px solid var(--role-color);border-radius:9px;padding:10px;min-height:190px}.role-column.drag-over{background:#edf1ff;border-color:#0a43f5;box-shadow:0 0 0 2px #dbe3ff}.role-column>header{display:flex;justify-content:space-between;align-items:flex-start;padding:2px 3px 10px}.role-column>header b{font:800 12px Manrope}.role-column>header small{display:block;color:#8993a3;font-size:8px;margin-top:2px}.role-column>header span{background:#fff;border:1px solid #e1e5ec;border-radius:12px;padding:2px 7px;font:700 9px Manrope}.role-members{display:flex;flex-direction:column;gap:7px}.member-card{display:grid;grid-template-columns:31px 1fr 10px;align-items:center;gap:8px;background:#fff;border:1px solid #e4e8ef;border-radius:7px;padding:8px;box-shadow:0 3px 10px rgba(25,40,75,.04)}.member-card[draggable="true"]{cursor:grab}.member-card[draggable="true"]:active{cursor:grabbing}.member-card.dragging{opacity:.45}.member-card>span{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#eaf0ff;color:#0a43f5;font-weight:800}.member-card b{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.member-card small{display:block;color:#919aa8;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.member-card i{font-style:normal;color:#35a56b;font-size:7px}.role-empty{border:1px dashed #ccd3df;border-radius:7px;padding:20px 8px;text-align:center;color:#a0a8b5;font-size:8px}.permission-table{min-width:720px}.permission-table th:not(:first-child),.permission-table td:not(:first-child){text-align:center}.permission-table td:first-child b{display:block;font-size:10px}.permission-table td:first-child small{display:block;color:#9aa3b1;font:500 7px Manrope}.permission-toggle{display:inline-grid;place-items:center;width:25px;height:25px;margin:auto;border:0;border-radius:50%;background:transparent;color:#ccd1da;font-weight:800}.permission-toggle.on{background:#e9efff;color:#0a43f5}.permission-toggle:disabled{cursor:default}.permission-editing .permission-toggle:not(:disabled){cursor:pointer;outline:2px dashed #9fb1ef;outline-offset:2px}.audit-list{padding:5px 20px 15px}.audit-row{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #edf0f4}.audit-row:last-child{border-bottom:0}.audit-row>span{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#eef2ff;color:#0a43f5}.audit-row b{display:block;font-size:10px}.audit-row small{display:block;font-size:8px;color:#929ba9}.audit-empty{text-align:center;color:#949dac;font-size:10px;padding:20px}.invite-note{font-size:10px;line-height:1.5;color:#748095;background:#f6f8fb;padding:10px;border-radius:7px;margin:0}
.member-manage-actions{display:flex;align-items:center;gap:5px;margin-top:5px}.member-manage-actions select{min-width:0;flex:1}.member-remove{border:1px solid #fecaca;background:#fff5f5;color:#b42318;border-radius:6px;padding:5px 7px;font:800 8px Manrope;cursor:pointer}.member-remove:hover{background:#fee2e2}
.member-role-select{display:block;width:100%;margin-top:5px;border:1px solid #dce2ee;border-radius:5px;background:#f8f9fc;padding:6px;font:700 9px Manrope;color:#33405a}
.warehouse-switcher{display:flex;align-items:center;gap:7px;padding:5px 7px;border:1px solid #dfe5ef;border-radius:9px;background:#fff;white-space:nowrap}.warehouse-switcher label{font-size:8px;color:#7a8598}.warehouse-switcher select{max-width:190px;border:0;background:transparent;font-weight:700;color:#17213a}.warehouse-switcher button{width:30px;height:30px;border:0;border-radius:7px;background:#eaf0ff;color:#1649f5;font-size:17px}
@media(max-width:760px){.warehouse-switcher{order:2;max-width:calc(100vw - 125px)}.warehouse-switcher label{display:none}.warehouse-switcher select{max-width:135px}.topbar .search{order:3;width:100%}}
@media(max-width:1100px){.role-board{grid-template-columns:repeat(5,210px)}.roles-card .card-head{align-items:center}.member-card{grid-template-columns:31px 1fr 10px}.member-role-select{display:block}.member-card[draggable="true"]{cursor:default}}@media(max-width:760px){.tenant-security-note{grid-template-columns:34px 1fr;padding:12px}.tenant-security-note>strong{grid-column:2;justify-self:start}.role-board{grid-template-columns:repeat(5,205px);padding:12px}.role-column{min-height:170px}.roles-card .card-head{align-items:flex-start}.roles-card .card-head button{font-size:0;width:42px;height:42px;padding:0}.roles-card .card-head button:first-letter{font-size:17px}.permission-card .table-wrap table{min-width:720px}}

/* Meaningful topbar action icons */
.top-actions .scan-btn,.top-actions .add-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.top-actions button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #ffb020;outline-offset:3px}
.empty-table-state{text-align:center!important;padding:38px 18px!important;color:#697386}.empty-table-state b,.empty-table-state small{display:block}.empty-table-state b{font-size:14px;color:#172038}.empty-table-state small{margin-top:5px}.notification-panel{padding:22px}.notification-panel .modal-head{margin-bottom:14px}.notification-item{display:grid;grid-template-columns:42px 1fr;gap:11px;align-items:center;padding:12px 0;border-top:1px solid #eceef3}.notification-item b,.notification-item small{display:block}.notification-item small{color:#697386;margin-top:3px}.notification-empty{padding:24px;text-align:center;background:#eef8f3;color:#197247;border-radius:10px}.table-wrap{position:relative}
@media(max-width:760px){
  .top-actions .scan-btn,.top-actions .add-btn{display:grid;place-items:center}
  .top-actions .scan-btn span,.top-actions .add-btn span{display:none}
  .top-actions .scan-btn svg,.top-actions .add-btn svg{width:21px;height:21px}
  .table-wrap:after{content:"ปัดซ้าย–ขวาเพื่อดูข้อมูลเพิ่มเติม →";display:block;position:sticky;left:0;padding:8px 12px;background:#f7f9fd;color:#697386;font-size:10px}
}

/* Custom PDF report export */
.heading-actions{display:flex;align-items:center;gap:10px}.report-export-btn{height:42px;border:1px solid #cbd7ff;border-radius:9px;background:#f1f5ff;color:#0a43f5;padding:0 15px;font-weight:800;cursor:pointer}.report-export-btn span{margin-right:5px;font-size:16px}.report-export-btn:hover{background:#e7edff}.report-export-modal form{width:min(520px,calc(100vw - 32px))}.report-export-modal .modal-head p:last-child{margin:4px 0 0;color:#7d8797;font-size:10px}.report-section-picker{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0;padding:0;border:0}.report-section-picker legend{grid-column:1/-1;margin-bottom:5px;font-size:11px;font-weight:800}.report-section-picker label{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:9px;min-height:64px;padding:11px;border:1px solid #dce3ef;border-radius:9px;background:#fafbfe;cursor:pointer}.report-section-picker label:has(input:checked){border-color:#89a5ff;background:#f1f5ff}.report-section-picker input{width:17px;height:17px;margin:1px 0 0;accent-color:#0a43f5}.report-section-picker b,.report-section-picker small{display:block}.report-section-picker b{font-size:10px}.report-section-picker small{margin-top:3px;color:#7d8797;font-size:8px;line-height:1.35}
@media(max-width:760px){.heading-actions{align-items:stretch}.report-export-btn{width:42px;padding:0;font-size:0}.report-export-btn span{margin:0;font-size:19px}.page-heading>.heading-actions{width:auto}.heading-actions .date-chip{display:none}.report-export-modal form{width:min(100%,calc(100vw - 20px));padding:18px}.report-section-picker{grid-template-columns:1fr}.report-section-picker label{min-height:58px}.report-section-picker b{font-size:12px}.report-section-picker small{font-size:10px}}
/* Authentication helpers */
.password-field{position:relative}.password-field input{width:100%;padding-right:58px}.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:#eef3ff;color:#1649f5;border-radius:7px;padding:6px 10px;font-weight:800;cursor:pointer}.optional{font-weight:500;color:#98a2b3}.auth-back{align-self:center}.forgot-fields{display:flex;flex-direction:column;gap:18px}
.otp-status{display:inline-flex;align-items:center;gap:7px;margin:10px 0 4px;padding:8px 12px;border-radius:8px;background:#eaf8f0;color:#197044;font-weight:800;font-size:13px}.success-modal-body{padding:34px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.success-modal-body>span{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#e8f7ef;color:#16854c;font-size:30px;font-weight:900}.success-modal-body h3{margin:4px 0 0;font-size:24px}.success-modal-body p{margin:0 0 8px;color:#667085}.success-modal-body .primary-btn{min-width:140px}
.otp-feedback{margin:0;padding:11px 13px;border-radius:8px;background:#f2f5ff;color:#34508a;font-size:13px;line-height:1.5}.otp-feedback:not(:empty){display:block}#signupOtpEmail[readonly]{background:#f7f8fb;color:#536078}#signupOtpSubmit{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px}

/* Product deletion */
.product-edit-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:4px}.product-edit-actions .primary-btn{flex:1}.danger-btn{border:1px solid #fecaca;background:#fff1f2;color:#be123c;border-radius:12px;padding:13px 18px;font:inherit;font-weight:800;cursor:pointer}.danger-btn:hover{background:#ffe4e6}.danger-btn:disabled{opacity:.55;cursor:wait}
.product-edit-modal{width:min(560px,calc(100% - 30px))}.product-edit-modal form{gap:14px}.modal-subtitle{margin:5px 0 0;color:#7b8494;font-size:11px;font-weight:500}.product-edit-section{display:flex;flex-direction:column;gap:13px;padding:15px;border:1px solid #e5e9f1;border-radius:12px;background:#fafbfe}.product-edit-section-title{margin:0;color:#0a43f5;font-size:11px;font-weight:800;letter-spacing:.04em}.product-edit-modal .form-note{margin:0;padding:10px 12px;border-radius:8px;background:#eef3ff;color:#41587b;font-size:10px}.product-edit-modal input{font-size:16px}.product-edit-modal input::placeholder{color:#a7afbc}
@media(max-width:560px){.product-edit-modal{width:100%}.product-edit-modal form{padding:14px 14px calc(16px + env(safe-area-inset-bottom));gap:12px}.product-edit-section{padding:13px;border-radius:10px}.product-edit-actions{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom));z-index:3;margin:0 -14px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);box-shadow:0 -8px 24px rgba(20,36,68,.08);align-items:stretch;flex-direction:column-reverse}.product-edit-actions .danger-btn,.product-edit-actions .primary-btn{width:100%;min-height:48px}}
[data-user-role="staff"] .open-product,[data-user-role="staff"] .edit-sku-btn,[data-user-role="staff"] #addWarehouseBtn,[data-user-role="staff"] [data-page="team"],[data-user-role="staff"] [data-page="settings"],[data-user-role="admin"] #deleteProductBtn{display:none!important}
.product-sku-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:3px}.product-sku-line small{display:inline-block}.compact-edit{padding:3px 7px;font-size:9px;line-height:1.2}.pill.low{background:#fee2e2!important;color:#b91c1c!important;border:1px solid #fecaca}.pill.low+small{color:#b91c1c}
@media(max-width:760px){.report-export-modal{width:calc(100% - 16px);max-height:calc(100dvh - 16px);margin:auto}.report-export-modal form{max-height:calc(100dvh - 16px);overflow-y:auto;padding-bottom:calc(18px + env(safe-area-inset-bottom))}.report-export-modal .primary-btn{position:sticky;bottom:0;min-height:50px;box-shadow:0 -8px 18px rgba(255,255,255,.95)}.live{display:none}}

/* Barcode generator and printable label */
.barcode-builder-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:18px}.barcode-builder-form{display:flex;flex-direction:column;gap:17px;padding:22px}.barcode-builder-form label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:700}.barcode-builder-form input,.barcode-builder-form select{height:48px;border:1px solid #dfe4ed;border-radius:8px;padding:0 13px;background:#fff;font:inherit}.generated-code-row{display:grid;grid-template-columns:1fr auto;gap:9px}.generated-code-row input{font:800 17px Manrope,monospace;letter-spacing:.08em;background:#f7f9fd}.barcode-safe-badge{padding:6px 9px;border-radius:20px;background:#e9f8ef;color:#197247;font-size:9px;font-weight:800;white-space:nowrap}.barcode-preview-card{display:flex;flex-direction:column}.barcode-label-preview{margin:20px;min-height:230px;padding:24px;border:1px solid #dfe5ef;border-radius:12px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 10px 30px rgba(19,39,80,.06)}.barcode-label-preview.empty{border-style:dashed;color:#8b95a6}.barcode-label-preview.empty>span{font-size:42px;color:#b8c3d4}.barcode-label-preview.empty p{line-height:1.55}.barcode-label-preview.empty small{color:#9aa5b5}.barcode-label-name{max-width:100%;font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.barcode-label-sku{margin:5px 0 10px;color:#697386;font-size:10px}.ean13-svg{display:block;width:min(100%,360px);height:auto}.barcode-print-btn{margin:auto 20px 20px;min-height:48px}.product-edit-modal label small{color:#7d8797;font-size:9px;font-weight:500;line-height:1.4}@media(max-width:760px){.barcode-builder-grid{grid-template-columns:1fr}.barcode-builder-form{padding:16px}.generated-code-row{grid-template-columns:1fr}.generated-code-row .primary-btn{min-height:48px}.barcode-label-preview{margin:14px;min-height:205px;padding:18px}.barcode-print-btn{margin:0 14px 14px}.barcode-safe-badge{white-space:normal}.ean13-svg{width:100%}}
.sku-rank{font-weight:800;color:#1649f5;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap}
.advanced-nav{position:relative}.advanced-vip{display:inline-flex;align-items:center;gap:4px;margin-left:auto;padding:3px 7px;border:1px solid #e7b52f;border-radius:999px;background:linear-gradient(135deg,#fff6c7,#e9b72e);color:#6e4800;font:800 9px Manrope,"IBM Plex Sans Thai",sans-serif;letter-spacing:.04em;box-shadow:0 3px 10px rgba(197,139,0,.2)}.advanced-vip i{font-style:normal;font-size:10px}.advanced-vip[hidden],.business-unlocked .advanced-vip{display:none!important}.advanced-nav.business-locked{color:#8a6a16}.advanced-nav.business-locked:hover{background:#fff8df;color:#6e4800}
/* Keep account controls reachable on every screen height. */
.sidebar{overflow:hidden}.sidebar nav{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.sidebar nav::-webkit-scrollbar{width:5px}.sidebar nav::-webkit-scrollbar-thumb{background:#cbd5e5;border-radius:10px}.sync-card,.profile,.logout-button{flex-shrink:0}.live{max-width:150px;display:inline-flex;align-items:center;gap:4px}.live span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Server reports, paginated history and audit-safe cancellation */
.row-actions{display:flex;gap:6px;flex-wrap:wrap}.data-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 16px;border-top:1px solid #e7ebf2}.data-pagination button{border:1px solid #ccd5e5;background:#fff;border-radius:8px;padding:8px 12px;font-weight:700;color:#1649f5}.data-pagination button:disabled{opacity:.4}.history-modal{width:min(1000px,calc(100vw - 24px));max-width:1000px}.history-range{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;margin:14px 0}.history-range label{display:grid;gap:6px}.history-range input{min-height:44px;border:1px solid #d8deea;border-radius:8px;padding:8px}.history-modal h4{margin:20px 0 8px}.pill.cancelled{background:#f3f4f6;color:#6b7280}
@media(max-width:640px){.history-range{grid-template-columns:1fr 1fr}.history-range .primary-btn{grid-column:1/-1}.data-pagination{justify-content:center;flex-wrap:wrap}.row-actions{min-width:170px}}
/* Business expiry notifications */
.notification-section+.notification-section{margin-top:18px}.notification-section h4{display:flex;align-items:center;gap:8px;margin:0 0 8px;color:#172038}.notification-section h4 span{padding:3px 7px;border-radius:999px;background:#fff0bd;color:#765000;font-size:10px}.notification-symbol{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff1d6;color:#b86c00;font-size:20px;font-weight:800}.notification-item.expiry.urgent .notification-symbol,.notification-item.expiry.expired .notification-symbol{background:#ffebeb;color:#c92b2b}.notification-item.expiry.expired b{color:#c92b2b}.notification-upgrade{display:grid;gap:3px;padding:14px;margin-bottom:16px;border:1px solid #edc34e;border-radius:12px;background:linear-gradient(135deg,#fff9df,#fff0b4);color:#765000}.notification-upgrade small{color:#8b6b22}.notification-loading{padding:30px;text-align:center;color:#697386}
#notificationBtn{position:relative;flex:0 0 44px;width:44px;height:44px;min-width:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid #dbe3f3;border-radius:14px;background:#fff;color:#2146b4;box-shadow:0 3px 10px #14284e0a;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
#notificationBtn svg{display:block;width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#notificationBtn:hover,#notificationBtn:focus-visible{background:#eef3ff;border-color:#98aeed;box-shadow:0 0 0 3px rgba(22,73,245,.12);outline:none;transform:translateY(-1px)}
#notificationBtn.has-alerts{border-color:#9bb3ff;background:#f2f5ff;color:#1649f5}
#notificationBtn b{position:absolute;top:-8px;right:-8px;min-width:21px;height:21px;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#1649f5;color:#fff;display:flex;align-items:center;justify-content:center;font:700 10px Manrope,"IBM Plex Sans Thai",sans-serif;line-height:1;box-shadow:0 3px 7px #1649f538}
#notificationBtn b[hidden],#notificationBtn b:empty{display:none}
@media(max-width:760px){.top-actions #notificationBtn{display:inline-flex}}
.notification-modal{width:min(560px,calc(100vw - 24px))}
.notification-panel{padding:22px}.notification-panel .modal-head{margin-bottom:12px}
.notification-tabs{display:flex;gap:6px;padding:4px;margin:0 0 10px;background:#f2f5fb;border-radius:12px}
.notification-tabs button{flex:1;border:0;border-radius:9px;background:transparent;color:#5d6d88;padding:9px 12px;font:700 13px "IBM Plex Sans Thai",sans-serif;cursor:pointer}
.notification-tabs button[aria-selected="true"]{background:#fff;color:#1649f5;box-shadow:0 2px 8px #17294c14}
.notification-tabs span{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;margin-left:4px;padding:0 5px;border-radius:999px;background:#e8eeff;color:#1649f5;font-size:11px}
#notificationList{max-height:min(62vh,620px);overflow:auto;scrollbar-gutter:stable}
.notification-entry{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;padding:15px 3px;border-bottom:1px solid #e9edf5}
.notification-entry-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#eaf0ff;color:#1649f5;font-size:19px;font-weight:800}
.notification-entry-body b{display:block;color:#172038;font-size:14px}.notification-entry-body p{margin:3px 0 0;color:#60708c;font-size:12px;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere}
.notification-entry-body small{display:block;margin-top:5px;color:#8290a9}.notification-type{display:block;margin-bottom:3px;color:#1649f5;font-size:10px;font-weight:800;letter-spacing:.04em}
.notification-entry.is-read .notification-entry-icon{background:#eef2f6;color:#7d8ba4}.notification-entry-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.notification-entry-actions button{border:1px solid #d7e1f7;border-radius:8px;background:#f5f8ff;color:#1649f5;padding:6px 10px;font:700 11px "IBM Plex Sans Thai",sans-serif;cursor:pointer}
.notification-entry-actions button:hover{background:#e8efff}.notification-entry-actions button:disabled{opacity:.55;cursor:wait}.notification-entry-actions .notification-delete{border-color:transparent;background:transparent;color:#73819a}.notification-entry-actions .notification-delete:hover{background:#fff0f0;color:#b83232}
.notification-empty{display:grid;gap:3px;padding:32px 18px;text-align:center;background:#f5f8ff;color:#1e4dbd;border-radius:12px}.notification-empty span{color:#697a95;font-size:12px}

/* Business stock-count submenu */
.advanced-subnav{width:calc(100% - 24px);margin:0 0 5px 24px;padding:8px 10px;border:0;border-left:2px solid #dce4f2;background:transparent;color:#7b879a;text-align:left;display:flex;align-items:center;gap:8px;border-radius:0 8px 8px 0;font-size:12px}.advanced-subnav:hover,.advanced-subnav.active{border-left-color:#1649f5;background:#f1f5ff;color:#1649f5}.advanced-subnav>span{font-size:15px}.advanced-subnav .advanced-vip{font-size:8px;padding:2px 5px}.advanced-nav.business-unlocked+.advanced-subnav .advanced-vip{display:none!important}

/* Business finance summary: prominent numbers above the movement chart */
.chart-finance-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 20px 14px}.chart-finance-summary[hidden]{display:none}.chart-finance-summary>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;border:1px solid #dce5ff;border-radius:12px;background:#f5f8ff}.chart-finance-summary span{color:#657188;font-size:12px}.chart-finance-summary strong{color:#124bf5;font:800 21px Manrope,'IBM Plex Sans Thai',sans-serif;white-space:nowrap}.chart-finance-summary>div:last-child{border-color:#d9eee7;background:#f3fbf8}.chart-finance-summary>div:last-child strong{color:#16805d}@media(max-width:760px){.chart-finance-summary{grid-template-columns:1fr;padding:0 16px 12px;gap:8px}.chart-finance-summary>div{padding:11px 12px}.chart-finance-summary strong{font-size:19px}}

/* Searchable product combobox in stock movement modal */
.permission-table .permission-toggle{appearance:auto;display:block;width:22px;height:22px;margin:auto;accent-color:#1649f5;cursor:pointer}.permission-table .permission-toggle:disabled{cursor:default;opacity:.75}.permission-edit-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid #e7ebf2}.permission-edit-actions[hidden]{display:none}.permission-edit-actions button{min-width:110px}.permission-card .card-head{gap:16px;flex-wrap:wrap}
#warehouseSourceWrap[hidden]{display:none!important}
.movement-product-field{position:relative}.movement-product-search{display:grid;grid-template-columns:auto minmax(0,1fr) 38px;align-items:center;gap:8px;margin-top:8px;border:1px solid #cfd8e8;border-radius:12px;background:#fff;transition:border-color .18s,box-shadow .18s}.movement-product-search:focus-within{border-color:#1649f5;box-shadow:0 0 0 4px rgba(22,73,245,.1)}.movement-product-search>span{padding-left:14px;color:#69758a;font-size:19px}.movement-product-search input{height:54px;margin:0;padding:0;border:0;outline:0;background:transparent;font-size:16px}.movement-product-search button{width:34px;height:34px;border:0;border-radius:9px;background:#eef2f8;color:#657188;font-size:18px}.movement-product-suggestions{position:absolute;z-index:20;top:84px;left:0;right:0;max-height:310px;overflow-y:auto;border:1px solid #d8e1ee;border-radius:13px;background:#fff;box-shadow:0 18px 50px rgba(15,36,76,.18);padding:6px}.movement-product-suggestions button{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px;border:0;border-radius:9px;background:#fff;padding:9px;text-align:left}.movement-product-suggestions button:hover,.movement-product-suggestions button.active{background:#eef3ff}.movement-product-suggestions .product-thumb{width:38px;height:38px;border-radius:9px}.movement-product-suggestions b,.movement-product-suggestions small{display:block}.movement-product-suggestions small{margin-top:2px;color:#78849a;font-size:10px}.movement-product-suggestions strong{color:#1649f5;font-size:11px;white-space:nowrap}.movement-search-empty{padding:24px;text-align:center;color:#7b8798}.movement-search-empty b,.movement-search-empty small{display:block}.movement-search-empty small{margin-top:4px}.movement-product-selected{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:10px;margin-top:8px;padding:10px 12px;border:1px solid #cce9db;border-radius:10px;background:#f1faf5}.movement-product-selected>span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#159765;color:#fff;font-weight:900}.movement-product-selected b,.movement-product-selected small{display:block}.movement-product-selected small{color:#657188;font-size:10px;margin-top:2px}@media(max-width:560px){.movement-product-suggestions{position:fixed;top:auto;left:12px;right:12px;bottom:12px;max-height:48vh;border-radius:16px;padding:8px}.movement-product-suggestions button{min-height:58px}.movement-product-search input{font-size:16px}}