:root{--cream: #f3ebdd;--cream-2: #ebe1cf;--paper: #fffdf8;--ink: #1e1a17;--ink-2: #5d5148;--line: #ddd2bf;--accent: #8a5a2b;--good: #2f7d4f;--good-bg: #e3f1e8;--warn: #9a6400;--warn-bg: #fbefd6;--bad: #b3261e;--bad-bg: #fbe4e2;--info-bg: #e8eef6;--radius: 10px;font-family:IBM Plex Sans Thai,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--cream);font-size:15px;line-height:1.5}*{box-sizing:border-box}body{margin:0;background:var(--cream)}a{color:var(--accent)}h1{font-size:22px;margin:0 0 16px;font-weight:600}h2{font-size:17px;margin:24px 0 10px;font-weight:600}.layout{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--paper);border-right:1px solid var(--line);padding:16px 12px;position:sticky;top:0;height:100vh;overflow:auto;flex-shrink:0}.sidebar .brand{display:flex;align-items:center;gap:10px;margin:0 6px 18px}.sidebar .brand img{width:44px;height:44px;border-radius:8px}.sidebar .brand span{font-family:Cormorant Garamond,Georgia,serif;font-size:20px;letter-spacing:1px}.sidebar nav a{display:block;padding:8px 10px;border-radius:8px;color:var(--ink);text-decoration:none;margin-bottom:2px}.sidebar nav a.active,.sidebar nav a:hover{background:var(--cream)}.sidebar .group{font-size:12px;color:var(--ink-2);margin:14px 10px 4px}.sidebar .me{margin-top:20px;padding:10px;font-size:13px;color:var(--ink-2);border-top:1px solid var(--line)}.main{flex:1;padding:24px 28px;min-width:0}.topbar{display:none}@media (max-width: 800px){.layout{display:block}.sidebar{position:fixed;top:0;left:0;bottom:0;height:100%;width:min(82vw,300px);z-index:30;transform:translate(-105%);transition:transform .22s ease;box-shadow:4px 0 24px #0000002e;padding-top:20px}.sidebar.open{transform:translate(0)}.sidebar nav a{padding:12px;font-size:16px}.sidebar .group{font-size:13px;margin-top:18px}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;z-index:25}.topbar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.topbar img{width:34px;height:34px;border-radius:6px}.menu-btn{background:transparent;border:1px solid var(--line);width:42px;height:42px;padding:0;flex-direction:column;justify-content:center;gap:5px}.menu-btn span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px}.main{padding:14px 12px}input,select,textarea{font-size:16px!important}.hide-sm{display:none!important}h1{font-size:20px}th,td{padding:8px 6px}}.show-sm{display:none}@media (max-width: 800px){.show-sm{display:block}}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:16px}.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px}.stat .n{font-size:26px;font-weight:600}.stat .l{color:var(--ink-2);font-size:13px}.stat.warn{border-color:var(--warn);background:var(--warn-bg)}.stat.bad{border-color:var(--bad);background:var(--bad-bg)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.end{justify-content:flex-end}.spacer{flex:1}.muted{color:var(--ink-2);font-size:13px}.right{text-align:right}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}table{width:100%;border-collapse:collapse;background:var(--paper)}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}th{font-weight:500;color:var(--ink-2);font-size:13px;background:var(--cream-2)}td.num,th.num{text-align:center;font-variant-numeric:tabular-nums}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius)}tr.clickable{cursor:pointer}tr.clickable:hover td{background:#fbf6ec}input,select,textarea{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);min-width:0}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--ink-2)}label>input,label>select,label>textarea{color:var(--ink);font-size:15px}.form{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}button,.btn{font:inherit;padding:8px 14px;border-radius:8px;border:1px solid var(--ink);background:var(--ink);color:var(--cream);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}button.secondary,.btn.secondary{background:transparent;color:var(--ink);border-color:var(--line)}button.danger{background:var(--bad);border-color:var(--bad);color:#fff}button:disabled{opacity:.5;cursor:not-allowed}button.small,.btn.small{padding:4px 10px;font-size:13px}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;background:var(--cream-2);white-space:nowrap}.badge.good{background:var(--good-bg);color:var(--good)}.badge.warn{background:var(--warn-bg);color:var(--warn)}.badge.bad{background:var(--bad-bg);color:var(--bad)}.badge.info{background:var(--info-bg);color:#2a4a7a}.alert{padding:10px 14px;border-radius:8px;margin-bottom:12px}.alert.bad{background:var(--bad-bg);color:var(--bad)}.alert.good{background:var(--good-bg);color:var(--good)}.alert.warn{background:var(--warn-bg);color:var(--warn)}.scan{font-size:20px;padding:14px;width:100%;border:2px solid var(--ink)}.flash-good{animation:fg .5s}.flash-bad{animation:fb .8s}@keyframes fg{0%{background:#bfe6cc}}@keyframes fb{0%{background:#f6b9b4}}.pack-line{display:flex;align-items:center;gap:12px;padding:12px;border-bottom:1px solid var(--line)}.pack-line.done{background:var(--good-bg)}.pack-line .qty{font-size:22px;font-weight:600;min-width:70px;text-align:right}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;flex-wrap:wrap}.tabs button{background:transparent;color:var(--ink-2);border:none;border-bottom:2px solid transparent;border-radius:0}.tabs button.active{color:var(--ink);border-bottom-color:var(--ink)}.login{max-width:360px;margin:10vh auto;padding:0 16px}.login img{width:140px;display:block;margin:0 auto 20px;border-radius:12px}.labels{display:flex;flex-wrap:wrap;gap:8px}.label-50x30{width:50mm;height:30mm;border:1px dashed var(--line);background:#fff;padding:1.5mm;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.label-50x30 .t{font-size:9px;line-height:1.1;text-align:center;max-height:2.2em;overflow:hidden}.label-50x30 svg{max-width:100%;height:17mm}@media print{.no-print,.sidebar,.topbar{display:none!important}.main{padding:0}body,.card{background:#fff;border:none}.labels{gap:0}.label-50x30{border:none;page-break-after:always}@page{margin:0}}.wh-switch{margin:0 10px 12px}.pack-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}.pack-cols h3{margin:0 0 6px;font-size:15px;color:var(--ink-2)}@media (max-width: 560px){.pack-cols{grid-template-columns:1fr}}.steps{list-style:none;padding:0;margin:10px 0 0}.steps li{padding:6px 0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.steps li>span:first-child{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;flex:none}.steps li.ok>span:first-child{background:var(--good-bg);color:var(--good)}.steps li.fail>span:first-child{background:var(--bad-bg);color:var(--bad)}.steps li.pending>span:first-child{background:var(--info-bg)}.slip{border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:14px;background:var(--paper);break-inside:avoid;page-break-inside:avoid}.slip table td,.slip table th{padding:4px 6px}label.inline{flex-direction:row;align-items:center;gap:6px;font-size:14px;color:var(--ink)}.print-out{display:none}@media print{body{background:#fff}.main{padding:0;max-width:none}body:has(.print-out) #root{display:none!important}.print-out{display:block}.print-page{break-after:page;page-break-after:always;break-inside:avoid}.print-page:last-child{break-after:auto;page-break-after:auto}.slip{border-color:#999;background:#fff;margin:0}.label-a4{display:block;max-width:100%;max-height:150mm;margin:0 auto 6mm}.paper-A6 .print-page{width:100mm;height:150mm;overflow:hidden;box-sizing:border-box}.paper-A6 .label-page img{width:100mm;height:150mm;object-fit:contain;display:block}.paper-A6 .slip{border:none;border-radius:0;padding:4mm;font-size:11px}}.slip.compact td{padding:1px 3px;font-size:10px}.slip.compact svg{max-width:100%;height:auto}.ch-icons{display:inline-flex;gap:4px}.ch-icon{display:inline-flex;align-items:center;justify-content:center;border-radius:6px;font-weight:700;line-height:1;flex:none;box-sizing:border-box}.ch-icon.on{background:var(--c);color:#fff}.ch-icon.off{background:transparent;color:var(--ink-2);border:1.5px dashed var(--line);opacity:.7}.ch-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;border-radius:999px;font-size:13px;border:1px solid var(--line);background:var(--paper)}.ch-pill.on{border-color:var(--good);background:var(--good-bg)}.ch-pill.off{color:var(--ink-2)}.nav-count{margin-left:6px;background:var(--bad);color:#fff;border-radius:999px;font-size:11px;padding:1px 7px}.guide h4{margin:18px 0 6px}.guide ol,.guide ul{margin:0;padding-left:22px;line-height:1.7}.test-frame{border:2px solid #000;height:100%;box-sizing:border-box;padding:3mm;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4mm}@media print{.paper-A4 .test-sheet{height:270mm}}@media print{.paper-L75 .print-page{width:100mm;min-height:75mm;box-sizing:border-box}.paper-L75 .label-page{height:75mm;overflow:hidden}.paper-L75 .label-page img{width:100mm;height:75mm;object-fit:contain;display:block}.paper-L75 .slip{border:none;border-radius:0;padding:3mm;font-size:10px}}.badge.printed{background:#e8e3f6;color:#4b3a8c}.cam{position:relative;margin-top:8px;border-radius:10px;overflow:hidden;background:#000}.cam video{display:block;width:100%;max-height:320px;object-fit:cover}.cam-aim{position:absolute;left:10%;right:10%;top:27.5%;bottom:27.5%;border:3px solid rgba(255,255,255,.9);border-radius:8px;box-shadow:0 0 0 999px #00000040;pointer-events:none}.cam-aim:after{content:"";position:absolute;left:6%;right:6%;top:50%;height:2px;background:#ff3b30}.cam.hit .cam-aim{border-color:#34c759}.cam-tip{position:absolute;left:0;right:0;bottom:6px;text-align:center;color:#fff;font-size:12px;text-shadow:0 1px 2px #000}.help h3{margin:0 0 8px;font-size:17px}.help li{margin-bottom:4px}.help ul ul,.help ol ul{margin-top:4px}@media print{.help{break-inside:avoid;border:none}.help a{color:inherit;text-decoration:none}}.only-print{display:none}@media print{.only-print{display:block}}.platform-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.platform-card{background:var(--paper);color:var(--ink);border:1.5px solid var(--line);justify-content:flex-start;gap:10px;padding:10px 12px;text-align:left}.platform-card.on{border-color:var(--ink);background:var(--cream)}.connect-step .step-no{width:28px;height:28px;border-radius:50%;background:var(--cream-2);display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:none}.connect-step.done .step-no{background:var(--good-bg);color:var(--good)}.guide-list{margin:0 0 6px;padding-left:20px;line-height:1.7}.copy-field{margin-top:8px}.copy-field code{flex:1;min-width:0;overflow-wrap:anywhere;background:var(--cream-2);padding:6px 8px;border-radius:6px;font-size:13px}.cam-tools{position:absolute;top:8px;right:8px;left:8px;display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}.cam-tools select,.cam-tools button{background:#ffffffe0!important;color:var(--ink);max-width:60%;padding:4px 8px}.cam-zoom{position:absolute;left:10%;right:10%;bottom:26px;display:flex;align-items:center;gap:8px;color:#fff;font-size:12px;text-shadow:0 1px 2px #000}.cam-zoom input{flex:1}.cam-tip{bottom:4px}.sub-panel{margin-top:12px;padding:12px;border:1px dashed var(--line);border-radius:8px;background:var(--cream)}.sub-panel .row.end{margin-top:10px}.adj-history{margin-top:12px}.adj-history summary{cursor:pointer;color:var(--ink-2);font-size:14px}.pair-code{font:700 22px ui-monospace,monospace;letter-spacing:4px;background:var(--cream-2);padding:2px 10px;border-radius:6px}.topic-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.share-row{display:grid;gap:8px;margin:4px 0 12px;max-width:640px}.share-row label{max-width:220px}.sidebar .group{font-size:14px;font-weight:700;color:var(--ink);background:var(--cream-2);border-left:4px solid var(--ink);border-radius:6px;padding:7px 10px;margin:16px 0 6px;letter-spacing:.2px}.sidebar nav .group~a{padding-left:18px;font-size:14px}@media (max-width: 800px){.sidebar .group{font-size:15px}.sidebar nav .group~a{font-size:16px}}