:root{--ink:#152e32;--muted:#647679;--line:#dce5e5;--bg:#f3f6f7;--primary:#14665d;--accent:#dc7a28;--white:#fff;font-family:'Segoe UI','Microsoft JhengHei',sans-serif;color:var(--ink);font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer;border:1px solid transparent;border-radius:9px;padding:11px 17px;font-weight:600;transition:background .15s}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible{outline:3px solid #e8a04b;outline-offset:3px}a{color:var(--primary)}input,select,textarea{width:100%;min-width:0;padding:11px 12px;border:1px solid #c5d3d4;border-radius:7px;background:white;color:var(--ink);margin-top:7px}input:focus,select:focus,textarea:focus{outline:2px solid #348d82;outline-offset:1px}input:disabled,select:disabled{background:#eef2f3}textarea{min-height:88px;resize:vertical}label{display:block;font-size:.9rem;font-weight:600}label small{display:block;margin-top:6px;font-weight:400}h1{font-size:1.85rem;letter-spacing:-.04em;margin:4px 0 0}h2{font-size:1.15rem;margin:0 0 20px}h3{font-size:1rem;margin-top:28px}p{line-height:1.7}small,.small{font-size:.85rem}.muted{color:var(--muted)}.eyebrow{font-size:.8rem;letter-spacing:.08em;color:var(--muted);margin:0 0 6px}.primary{background:var(--primary);color:white}.primary:hover{background:#0b4e47}.secondary{background:white;border-color:#bccdce;color:var(--ink)}.secondary:hover{background:#eef4f3}.ghost,.text-button{background:transparent;color:var(--primary);padding:6px}.full{width:100%}.brand-mark{display:inline-grid;place-items:center;background:#e68e35;color:#172f31;width:44px;height:44px;font-size:1.45rem;font-weight:800;border-radius:12px}.shell{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#132f32;color:#d8e5e4;padding:30px 18px 22px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;font-size:1.4rem;font-weight:700;padding:0 10px 28px}.brand small{display:block;font-size:.75rem;letter-spacing:.05em;color:#a8bfbe;font-weight:400;margin-top:3px}.nav-label{font-size:.8rem;color:#9db6b7;padding:10px 14px}.sidebar nav{display:grid;gap:5px;overflow-y:auto}.sidebar nav button{text-align:left;background:transparent;color:#c7d9d9;font-size:.95rem;padding:12px;border-radius:8px;white-space:nowrap}.sidebar nav button:hover{background:#234246}.sidebar nav button.active{background:#2b514f;color:white;box-shadow:inset 3px 0 #e89c43}.nav-icon{display:inline-block;width:30px;font-size:1.15rem}.sidebar-bottom{margin-top:auto;padding:24px 10px 0}.sidebar-bottom .ghost{color:#d7e9e7}.sidebar-bottom p{margin:10px 0}.version{font-size:.75rem;color:#a8bfbe}.tag{display:inline-block;border-radius:5px;font-size:.78rem;padding:4px 7px;background:#e4eeeb;color:#205c52;font-weight:500}.workspace{padding:30px 38px 16px;max-width:1680px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px}.surface-fieldset{border:0;margin:0;padding:0;min-width:0}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px}.stat{background:white;border:1px solid var(--line);padding:24px;border-radius:13px;display:grid;gap:16px}.stat span{font-size:.9rem;color:var(--muted)}.stat strong{font-size:2rem;font-weight:650;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.stat small{color:var(--muted);font-size:.8rem}.primary-stat{background:var(--primary);color:white;border-color:var(--primary)}.primary-stat span,.primary-stat small{color:#d8ece7}.dashboard-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:24px}.panel{background:white;border:1px solid var(--line);border-radius:13px;padding:25px;margin-bottom:24px;min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.panel-heading h2{margin:0}.flow-count{display:grid;grid-template-columns:1fr 1fr;margin:26px 0}.flow-count div{display:grid;gap:8px;border-left:3px solid #d3e6e1;padding-left:18px}.flow-count div:first-child{border-color:var(--accent)}.flow-count strong{font-size:2.5rem;line-height:1.2}.flow-count span{color:var(--muted)}.quick-actions{display:grid;gap:8px}.quick-actions button{display:flex;justify-content:space-between;gap:10px;text-align:left;background:#f4f7f7;padding:14px;font-size:.95rem}.quick-actions button span{font-size:.8rem;color:var(--muted);font-weight:400}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px;margin-bottom:22px}.wide{grid-column:1/-1}.table-scroll{overflow:auto;max-width:100%}table{border-collapse:collapse;width:100%;font-size:.9rem}th{color:var(--muted);font-weight:500;text-align:left;background:#f5f8f8;white-space:nowrap}th,td{padding:15px 13px;border-bottom:1px solid #e5eded}td{max-width:420px;overflow-wrap:anywhere;line-height:1.6}tbody tr:last-child td{border:0}.empty{padding:38px 15px;text-align:center;color:var(--muted);background:#f8fafb;border-radius:8px}.empty p{font-size:.9rem}.notice{padding:14px 18px;border-radius:8px;margin-bottom:20px;border:1px solid}.error{background:#fff0ec;border-color:#e7beb1;color:#873e28}.success{background:#e9f6ef;border-color:#beded0;color:#206046}.order-card{border-top:1px solid var(--line);padding:20px 0}.order-head,.order-foot{display:flex;justify-content:space-between;align-items:center;gap:15px}.order-head p{font-size:.9rem;color:var(--muted);margin:6px 0 0}.order-head strong{font-size:.95rem}.order-foot{margin-top:18px;font-size:.9rem}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.status{padding:6px 11px;border-radius:20px;font-size:.8rem;white-space:nowrap;background:#edf1f2}.submitted{background:#fff0d8;color:#8f550e}.shipped{background:#e6f0fc;color:#355f8e}.received{background:#e3f2e9;color:#30664c}.cart{display:grid;gap:6px;margin:14px 0}.cart>div{padding:9px 12px;background:#f3f7f7;border-radius:7px}.clock-panel{border-top:4px solid var(--primary)}.clock-panel h2{font-size:1.6rem;margin:15px 0}.field-card{padding:22px 0;border-top:1px solid var(--line)}.field-title{display:flex;align-items:center;gap:12px;margin-bottom:18px}.check{display:flex;gap:8px;align-items:center}.check input{width:18px;height:18px;margin:0}.sql-preview{padding:16px;background:#eff5f4;border-radius:8px;display:grid;gap:15px;margin-top:20px}.sql-preview code{overflow-wrap:anywhere;line-height:1.7}.sql-preview button{justify-self:start}.footer{display:flex;justify-content:space-between;color:var(--muted);font-size:.8rem;padding:8px 0 12px}.login-wrap{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-intro{background:#123b3c;color:white;padding:12vh 12%;display:flex;flex-direction:column;align-items:flex-start}.login-intro .eyebrow{color:#adc9c5;margin-top:40px}.login-intro h1{font-size:clamp(2rem,4vw,3.5rem);line-height:1.5;margin:12px 0}.login-intro>p:not(.eyebrow){color:#c0d8d5}.login-foot{margin-top:auto;padding-top:45px;font-size:.8rem;color:#a6c7c2}.login-card{align-self:center;width:min(420px,80%);margin:60px auto}.login-card h2{font-size:1.8rem;margin:10px 0}.login-card label{margin:22px 0}.login-card .primary{margin-top:8px}.loading{padding:80px;text-align:center}#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;z-index:1000;background:#fff1cb;padding:16px;text-align:center}#blazor-error-ui span{margin-left:12px;font-size:.85rem}@media(min-width:1600px){.workspace{padding-top:40px}}@media(max-width:1100px){.shell{grid-template-columns:208px minmax(0,1fr)}.workspace{padding:24px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.order-foot{align-items:flex-start;flex-direction:column}.sidebar{padding-left:10px;padding-right:10px}}@media(max-width:720px){.shell{display:block}.sidebar{position:static;height:auto;padding:16px}.brand{padding:0 0 16px;font-size:1.2rem}.brand small{display:none}.brand-mark{width:36px;height:36px;font-size:1.2rem}.nav-label{display:none}.sidebar nav{display:flex;overflow-x:auto;gap:5px;padding-bottom:3px}.sidebar nav button{padding:10px 12px;font-size:.9rem}.nav-icon{display:none}.sidebar-bottom{padding:12px 0 0;display:flex;justify-content:space-between;align-items:center}.sidebar-bottom .version{display:none}.sidebar-bottom p{margin:0;font-size:.85rem}.workspace{padding:22px 16px}.topbar{margin-bottom:22px}h1{font-size:1.55rem}.topbar .eyebrow{font-size:.75rem}.topbar>.secondary{font-size:.8rem;padding:9px}.stats{gap:10px;margin-bottom:16px}.stat{padding:18px 14px;gap:12px}.stat strong{font-size:1.65rem}.stat span{font-size:.85rem}.stat small{font-size:.75rem}.panel{padding:18px;margin-bottom:16px}.form-grid{grid-template-columns:1fr;gap:16px}.dashboard-grid{gap:0}.quick-actions button{display:grid;gap:5px}table thead{display:none}table,tbody,tr,td{display:block;width:100%;max-width:none}tr{padding:12px 0;border-bottom:1px solid var(--line)}td{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;padding:6px 0;border:0!important}td:before{content:attr(data-label);color:var(--muted)}.order-head{align-items:flex-start}.order-head strong{font-size:.85rem;overflow-wrap:anywhere}.order-foot .actions{width:100%}.order-foot button{flex:1}.login-wrap{display:block}.login-intro{padding:30px 10%}.login-intro .eyebrow,.login-foot,.login-intro>p:not(.eyebrow){display:none}.login-intro h1{font-size:1.6rem;line-height:1.4;margin:18px 0 0}.login-intro h1 br{display:none}.login-card{margin:35px auto}.footer{font-size:.75rem;gap:10px}.field-title{flex-wrap:wrap}.flow-count strong{font-size:2rem}}

/* Designed forms: desktop layout and mobile single column. */
.designed-grid{display:grid;gap:18px}.designed-grid.columns-1{grid-template-columns:minmax(0,1fr)}.designed-grid.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.designed-grid .span-all{grid-column:1/-1}.designed-grid label{min-width:0}.designed-grid input,.designed-grid select,.designed-grid textarea{width:100%;box-sizing:border-box}.form-preview{margin-top:24px;padding:24px;border:1px solid #dadfd9;border-radius:16px;background:#f7f9f5}.form-sql{white-space:pre-wrap;overflow-wrap:anywhere;padding:16px;background:#162c29;color:#e0f0ea;border-radius:12px}.form-role-list>div{display:flex;flex-wrap:wrap;gap:18px;align-items:center;padding:12px 0;border-bottom:1px solid #e4e9e3}.form-role-list strong{min-width:180px}.form-records{overflow:auto;max-width:100%}.form-records table{width:100%;border-collapse:collapse}.form-records th,.form-records td{padding:12px;text-align:left;min-width:100px;border-bottom:1px solid #e4e9e3;max-width:360px;overflow-wrap:anywhere}.form-records td{white-space:pre-wrap}@media(max-width:700px){.designed-grid.columns-2{grid-template-columns:minmax(0,1fr)}.form-preview{padding:16px}}

.retail-table input{min-width:75px;width:100%;max-width:140px}.retail-table small,.retail-payment{display:block;margin:4px 0}.retail-total{font-size:1.1rem;padding:16px 0}.retail-table th{white-space:nowrap}@media(max-width:700px){.retail-table input{max-width:100%;min-width:0}.retail-table td{gap:12px}.retail-total{line-height:1.8}}

/* Compact navigation: small screens use a disclosure instead of a horizontal strip. */
.mobile-menu-toggle{display:none}.workspace{min-width:0}.sidebar{min-width:0;height:100dvh}.sidebar nav{min-height:0;flex:1;overflow-x:hidden}.topbar>div,.form-grid>*,.stats>*{min-width:0}.topbar h1,.sidebar-bottom p{overflow-wrap:anywhere}
@media(max-width:900px){
 .shell{display:block}.sidebar{position:static;height:auto;padding:16px}.brand{padding:0 0 12px;font-size:1.2rem}.brand small,.nav-label,.nav-icon,.sidebar-bottom .version{display:none}
 .mobile-menu-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;background:#234246;color:white;text-align:left;min-height:44px}
 .mobile-menu-toggle span{font-size:.85rem;font-weight:400;overflow-wrap:anywhere}
 .sidebar nav{display:none;overflow:visible;padding:12px 0 0;gap:6px}
 .sidebar nav.is-open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .sidebar nav button{white-space:normal;overflow-wrap:anywhere;min-width:0;min-height:44px;padding:10px 12px;font-size:.9rem}
 .sidebar-bottom{padding:12px 0 0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px}.sidebar-bottom p{margin:0;font-size:.85rem}
 .workspace{padding:22px 16px}.topbar{flex-wrap:wrap}.footer{flex-wrap:wrap;gap:8px}
}
@media(max-width:720px){
 .form-records td{min-width:0;max-width:none;padding:8px 0}.form-records th{min-width:0}
 .panel-heading,.field-title{flex-wrap:wrap}.actions>button{white-space:normal;max-width:100%}
}
/* Settings are grouped after permission filtering, on desktop and mobile. */
.settings-group{min-width:0;grid-column:1/-1}.settings-group summary{cursor:pointer;color:#c7d9d9;font-size:.95rem;font-weight:600;padding:12px;border-radius:8px;overflow-wrap:anywhere}.settings-group summary:hover{background:#234246}.settings-group summary.active{background:#2b514f;color:#fff}.settings-group summary:focus-visible{outline:3px solid #e8a04b;outline-offset:-3px}.settings-items{display:grid;gap:5px;padding:6px 0 6px 16px;margin-left:12px;border-left:1px solid #476361}.sidebar nav .settings-items button{white-space:normal;font-size:.9rem}.settings-group summary::marker{color:#e8a04b}
@media(max-width:900px){.settings-items{grid-template-columns:repeat(2,minmax(0,1fr));padding-left:8px;margin-left:4px}.settings-group summary{min-height:44px}}
.list-query{display:flex;align-items:end;gap:16px;margin:16px 0}.list-query label{flex:1;max-width:480px}.list-query span{white-space:nowrap;color:#617575}.selected-row{background:#e0f2ed!important;outline:2px solid #397d6c;outline-offset:-2px}tr[tabindex="0"]{cursor:pointer}tr[tabindex="0"]:focus{outline:2px solid #397d6c}.version-fields{display:grid;grid-template-columns:minmax(100px,1fr) 3fr;gap:8px}.version-fields dd{margin:0;overflow-wrap:anywhere}.version-fields dt{font-weight:700}

/* Full viewport dialogs keep the underlying list and its scroll position. */
body:has(dialog.erp-full-dialog[open]){overflow:hidden}
dialog.erp-full-dialog{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#f3f7f7;color:#183536;box-sizing:border-box;overflow:hidden}
dialog.erp-full-dialog[open]{display:flex;flex-direction:column}
dialog.erp-full-dialog::backdrop{background:#16333399}
.erp-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;background:white;border-bottom:1px solid #dce5e5;flex-shrink:0}
.erp-dialog-header h2{margin:0;font-size:1.3rem}
.erp-dialog-content{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
.erp-dialog-content>.panel{margin:0 0 20px}
@media(max-width:600px){.erp-dialog-header{padding:12px 16px}.erp-dialog-content{padding:16px}.erp-dialog-header h2{font-size:1.1rem}}