:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#17202a;background:#f7f8fa;font-size:16px;line-height:1.45;--navy:#14213D;--cyan:#00A6A6;--line:#D8DEE8;--red:#C43D3D}*{box-sizing:border-box}html,body,#root{min-height:100%;max-width:100%;overflow-x:hidden}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;min-height:44px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7bd8d8;outline-offset:2px}.shell{min-height:100vh;min-height:100dvh}header{height:72px;background:var(--navy);color:#fff;padding:0 clamp(16px,5vw,72px);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center}.brand strong{display:block;font-size:15px}.brand small{display:block;color:#b7c2d7;font-size:12px}.brand-bar,.barcode{font-family:monospace;letter-spacing:-3px;color:var(--cyan);font-weight:900}.brand-bar{font-size:26px}.logout{color:#dce4f1;background:transparent;border:1px solid #60708d;padding:8px 14px;border-radius:4px}.content{max-width:1280px;margin:auto;padding:52px clamp(16px,5vw,72px)}.heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:36px}.eyebrow{color:var(--cyan);font-size:11px;font-weight:800;letter-spacing:.12em;margin:0 0 8px}.heading h1{font-size:36px;line-height:1.1;margin:0 0 8px;letter-spacing:-.04em}.muted{color:#617087;margin:0}.primary{background:var(--cyan);color:#062f34;border:0;border-radius:4px;padding:12px 18px;font-weight:750}.primary:hover{background:#11b9b4}.add{white-space:nowrap}.filters{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;display:flex;gap:12px;align-items:center;margin-bottom:18px}.search{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:#fff;padding:9px 12px;flex:1;max-width:580px;min-height:46px}.search span{font-size:22px;color:#617087}.search input{border:0;outline:0;width:100%;background:transparent;min-width:0;font-size:16px}.filters select,select{border:1px solid var(--line);background:#fff;border-radius:3px;padding:10px 12px;min-height:46px}.count{margin-left:auto;color:#617087;font-size:14px;white-space:nowrap}.table-wrap{background:#fff;border:1px solid var(--line);overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th{background:#eef1f5;color:#526078;font-size:12px;font-weight:700;padding:13px 16px}td{padding:18px 16px;border-top:1px solid var(--line);vertical-align:middle}code{font-family:SFMono-Regular,Consolas,monospace;font-size:13px;letter-spacing:.01em;overflow-wrap:anywhere}td small{display:block;color:#758198;font-size:12px;margin-top:4px;overflow-wrap:anywhere}.badge{font-size:12px;color:#176765;background:#d8f1ef;border-radius:20px;padding:5px 9px;white-space:nowrap}.badge.assigned{color:#7a5915;background:#f9edc9}.badge.inactive{color:#943b3b;background:#f8dfdf}.date{color:#617087;font-size:14px}.actions{white-space:nowrap;text-align:right}.actions button{background:transparent;border:0;color:var(--navy);font-weight:700;padding:5px 8px}.actions .delete{color:var(--red)}.empty{text-align:center;padding:100px 20px;border:1px dashed var(--line);background:#fff}.faded{display:block;color:#c8d1df;font-size:26px;margin-bottom:18px}.empty h2{margin:0 0 6px}.empty button{margin-top:22px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#14213dcc;display:flex;justify-content:flex-end;z-index:2}.form-panel{background:#fff;width:min(600px,100%);height:100%;height:100dvh;overflow:auto;padding:34px clamp(20px,4vw,48px);box-shadow:-10px 0 30px #14213d22;padding-bottom:max(34px,env(safe-area-inset-bottom))}.panel-title{display:flex;justify-content:space-between;margin-bottom:30px}.panel-title h2{margin:0;font-size:25px}.icon-button{border:0;background:transparent;font-size:28px;color:#617087;line-height:1;padding:6px;min-width:44px}.field{margin-bottom:20px}.field label{display:block;font-weight:700;font-size:14px;margin-bottom:7px}.field label span{font-weight:400;color:#758198}.field input,.field textarea{width:100%;border:1px solid #b7c1d0;border-radius:3px;padding:11px 12px;background:#fff;font-size:16px}.field textarea{resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.iccid-row{display:flex;align-items:end;gap:10px}.grow{flex:1}.scan-button{height:47px;display:flex;align-items:center;gap:9px;border:1px solid var(--cyan);color:#007b7a;background:#e7f8f7;border-radius:3px;padding:0 12px;font-weight:700;white-space:nowrap;margin-bottom:20px}.small{font-size:16px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:28px}.secondary{background:#fff;border:1px solid #aeb9ca;border-radius:3px;padding:11px 16px;color:var(--navy);font-weight:650}.error{color:var(--red);font-size:14px;background:#fff0f0;border-left:3px solid var(--red);padding:9px 12px}.login{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;max-width:400px;margin:auto;padding:24px max(24px,env(safe-area-inset-left))}.login-mark{margin-bottom:34px;color:var(--navy);display:flex;flex-direction:column;gap:6px}.login-mark .barcode{font-size:28px}.login h1{font-size:34px;margin:0 0 7px}.login-form{margin-top:32px}.login-form input{width:100%;padding:13px;border:1px solid #b7c1d0;border-radius:3px;margin:8px 0 16px;font-size:16px}.login-form .primary{width:100%}.loading{text-align:center;padding:20vh 24px;color:#617087}.scanner{position:fixed;top:0;right:0;bottom:0;left:0;background:#101a2d;z-index:4;color:#fff;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;align-items:center;height:100dvh;overflow:auto}.scanner-head{width:min(600px,100%);display:flex;justify-content:space-between;align-items:center}.scanner-head h2{font-size:21px}.scanner .icon-button{color:#fff}.video-wrap{width:min(600px,100%);aspect-ratio:3/4;max-height:62dvh;background:#000;position:relative;overflow:hidden;margin:20px 0}.video-wrap video{width:100%;height:100%;object-fit:cover}.scan-line{position:absolute;left:8%;right:8%;top:50%;border-top:2px solid var(--cyan);box-shadow:0 0 12px var(--cyan)}.scanner .muted{color:#d8e0ec;text-align:center}.scanner .secondary{margin-top:22px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:700px){header{height:64px;padding-top:env(safe-area-inset-top);box-sizing:content-box}.content{padding:28px 16px max(32px,env(safe-area-inset-bottom))}.heading{display:block;margin-bottom:24px}.heading h1{font-size:29px}.add{margin-top:20px;width:100%}.filters{display:grid;grid-template-columns:1fr auto;gap:10px}.search{grid-column:1/-1;max-width:none}.count{margin-left:0;align-self:center}.table-wrap{border:0;background:transparent;overflow:visible}table,thead,tbody,tr,td{display:block}thead{display:none}tr{background:#fff;border:1px solid var(--line);margin-bottom:12px;padding:14px 14px 12px;position:relative}td{border:0;padding:7px 0 7px 82px;min-height:34px;position:relative;overflow-wrap:anywhere}td:before{content:attr(data-label);position:absolute;left:0;top:7px;width:72px;color:#718097;font-size:11px;font-weight:750}td:first-child{padding:2px 0 14px;border-bottom:1px solid var(--line);margin-bottom:4px}td:first-child:before{display:none}td:first-child code{display:block;color:var(--navy);font-size:clamp(15px,4vw,18px);font-weight:750;line-height:1.3;overflow-wrap:anywhere}.actions{padding:12px 0 0;text-align:left;border-top:1px solid var(--line);margin-top:6px}.actions:before{display:none}.actions button{padding:0 14px 0 0;margin-right:14px}.date{font-size:13px}.two{grid-template-columns:1fr;gap:0}.iccid-row{display:flex;flex-direction:column;align-items:stretch;gap:0}.scan-button{width:100%;justify-content:center;margin-bottom:20px;order:-1}.form-panel{padding:calc(16px + env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom))}.panel-title{position:sticky;top:calc(-1*(16px + env(safe-area-inset-top)));z-index:1;background:#fff;padding:4px 0 16px;margin:0 0 18px}.form-actions{position:sticky;bottom:0;background:#fff;padding:12px 0 max(4px,env(safe-area-inset-bottom));margin:8px 0 0;z-index:1}.form-actions>*{flex:1}.empty{padding:70px 20px}.scanner .video-wrap{margin:16px 0;max-height:58dvh}}@media(max-width:360px){.content{padding-left:12px;padding-right:12px}.heading h1{font-size:26px}.filters{grid-template-columns:1fr}.count{justify-self:start}.video-wrap{max-height:52dvh}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.photo-button{display:flex;align-items:center;justify-content:center;min-height:46px;margin-top:18px;padding:10px 16px;border:1px solid var(--cyan);border-radius:3px;background:#e7f8f7;color:#062f34;font-weight:700;cursor:pointer}.photo-button input{position:absolute;width:1px;height:1px;opacity:0}.scanner-hint{color:#ffe8a3;text-align:center;font-size:14px}.search-scan-button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--cyan);color:#007b7a;background:#e7f8f7;border-radius:3px;padding:0 12px;font-weight:700;white-space:nowrap}.scanner-canvas{display:none}
