/* Screen-only shop identity: printed customer documents keep their own layout. */
@media screen {
 :root{--bg:#f4f5f7;--ink:#203149;--muted:#637286;--line:#dfe4eb;--green:#17334e;--gold:#96712f;--pale:#edf2f7}
 body{font-family:'Segoe UI','Noto Sans Khmer','Khmer OS',sans-serif;-webkit-font-smoothing:antialiased}
 .sidebar{width:252px;padding:28px 18px;background:linear-gradient(165deg,#172e49,#0c1c30);border-right:1px solid #bda26940}
 .brand{flex-direction:column;gap:10px;text-align:center;letter-spacing:0;padding-bottom:22px;border-bottom:1px solid #ffffff19}
 .brand-logo{width:88px;height:112px;object-fit:contain}
 .brand .brand-km{font-family:'Khmer OS','Noto Sans Khmer',sans-serif;color:#f2dfb5;font-size:21px;line-height:1.8}
 .brand .brand-en{font:600 13px 'Segoe UI',sans-serif;color:#fff;letter-spacing:2px;margin-top:5px}
 .brand .brand-caption{font-size:9px;letter-spacing:2.8px;color:#c8b587;margin-top:8px}
 .navlabel{color:#a4b4c9;margin-top:25px;font-size:10px}
 .sidebar nav button{padding:12px 13px;color:#c5d0df;border:1px solid transparent;border-radius:8px;margin-bottom:5px;font-size:13px}
 .sidebar nav button.active{background:#ffffff10;border-color:#bda26966;color:#f4dfb0;box-shadow:inset 3px 0 #c8a766}
 .sidebar nav button:hover{background:#ffffff12}
 .sidebar nav button span{color:#c8a766}
 .sidebottom,.sidebottom label{color:#c0cdde}.sidebottom p,.sidebottom small{color:#a5b5ca}
 .sidebottom select{background:#1c3551;border-color:#415671}
 main{margin-left:252px}header{background:#fff;padding:0 32px;height:72px}.breadcrumb{color:#68768a}
 #rate-pill{background:#faf6eb;border:1px solid #e8ddc4;padding:9px 13px;border-radius:7px;color:#785924;font-variant-numeric:tabular-nums}
 .avatar{background:#17334e;color:#ecd3a0;font-size:11px;font-weight:700}
 #app{padding:30px 32px 60px;max-width:1700px}
 h1{font-family:'Segoe UI','Noto Sans Khmer',sans-serif;font-size:29px;font-weight:600;letter-spacing:-.7px}h2{font-family:'Segoe UI','Noto Sans Khmer',sans-serif;font-size:19px;font-weight:600;letter-spacing:-.3px}
 .eyebrow{font-size:10px;font-weight:600;letter-spacing:2px}.sub{color:#627085}
 .panel,.card{border-color:#e0e5ec;border-radius:12px;box-shadow:0 3px 12px #172e4905}.card{border-top:3px solid #c4a568}
 .metric{font-weight:600;color:#17334e}.metric-label{font-size:12px}.metric-note{font-size:11px}
 button{border-radius:7px;padding:11px 17px;font-size:12px}button.secondary{border-color:#cdd6e0}button:focus-visible{outline:3px solid #c4a568;outline-offset:3px}
 label{color:#52647a;font-size:12px}input,select,textarea{border-color:#cdd6e0;border-radius:7px;min-height:40px;font-family:inherit}input[type=checkbox]{min-height:initial}
 th{color:#5d6d82;background:#f6f8fa;font-weight:600}td{border-color:#e9edf2}.code{color:#66768b}
 .tag{background:#eaf1f2;color:#365d62}.tag.gold{color:#795a24;background:#f7efdE}.tag.gray{color:#5d6d80;background:#edf0f4}
 .notice{background:#faf6eb;border-color:#e8ddc4;color:#735c30}.bar{background:#c2d0df}.bar-group:nth-child(3) .bar{background:#244563}
 .pos-checkout{border-top:3px solid #c4a568}.pos-product{background:#fff}.pos-line{border-color:#e0e5ec}
 dialog::backdrop,.workflow-dialog::backdrop{background:#0c1c3080;backdrop-filter:blur(3px)}#toast{background:#17334e}
 .login-page{min-height:100vh;background:radial-gradient(ellipse at 15% 15%,#284867,#0c1c30 75%)}
 .login-layout{margin:0;min-height:100vh;display:grid;place-items:center;padding:36px 20px}
 .login-card{width:min(440px,100%);background:#fff;border:1px solid #c6aa71;border-radius:18px;padding:34px 38px;box-shadow:0 24px 80px #0005}
 .login-identity{text-align:center;padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid #e5e7ec}.login-identity .brand-logo{width:90px;height:115px}.login-km{font-size:24px;line-height:1.8;color:#17334e;margin:6px 0}.login-en{font-size:14px;font-weight:600;letter-spacing:2px;margin:5px 0;color:#17334e}.login-caption{font-size:10px;letter-spacing:3px;color:#96712f}
 .login-card h1{font-size:22px}.login-card .sub{margin-bottom:22px}.login-card button{width:100%;padding:13px}.login-card #error{color:#a74435;font-size:13px}.login-foot{text-align:center;font-size:11px;color:#a5b5ca;margin:22px 0 0;letter-spacing:.4px}
 @media(max-width:1100px){.sidebar{width:215px;padding:22px 13px}main{margin-left:215px}#app{padding:24px}.brand .brand-km{font-size:19px}.brand .brand-en{font-size:11px}header{padding:0 24px}}
 @media(max-width:650px){.sidebar{position:static;width:100%;padding:14px 16px}.brand{flex-direction:row;text-align:left;gap:14px;padding-bottom:12px}.brand-logo{width:42px;height:55px}.brand .brand-km{font-size:18px;line-height:1.4}.brand .brand-en{font-size:10px;margin-top:4px}.brand .brand-caption{display:none}.sidebar nav{margin-top:10px}.sidebar nav button{padding:10px;margin-bottom:0;font-size:12px}main{margin:0}header{padding:12px 16px;height:auto;gap:10px;flex-wrap:wrap}.header-right{gap:12px}#app{padding:22px 16px}.pagehead{flex-wrap:wrap}h1{font-size:25px}.login-card{padding:28px 25px}.grid2{grid-template-columns:1fr}}
}

@media screen{.login-layout>div{width:min(440px,100%)}.login-card{width:100%}}

/* Make the practice environment unmistakable. */
header{border-top:6px solid #c77b16}.sidebottom{border-top:3px solid #c77b16}