:root{--black:#080808;--ink:#191919;--muted:#6b6b6b;--line:#dedede;--soft:#f5f5f3;--white:#fff;--radius:16px}*{box-sizing:border-box}html{font-family:Arial,"Noto Sans Thai",Tahoma,sans-serif;background:#fff}body{margin:0;min-height:100vh;color:var(--black);background:linear-gradient(180deg,#fafafa 0,#fff 220px);font-size:15px}.container-shell{width:min(1180px,calc(100% - 40px));margin:0 auto}.site-header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#000}.brand-mark{width:42px;height:42px;border:1px solid #000;border-radius:12px;display:grid;place-items:center;overflow:hidden;background:#000}.brand-mark img{width:34px;height:34px;object-fit:contain;filter:grayscale(1) brightness(3)}.brand strong{font-size:17px;letter-spacing:.04em;display:block}.brand small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.primary-nav{display:flex;align-items:center;gap:4px}.primary-nav a{color:#555;text-decoration:none;padding:11px 16px;border-radius:10px;font-weight:700}.primary-nav a:hover,.primary-nav a.active{color:#fff;background:#000}.menu-button{display:none;border:1px solid #000;background:#fff;padding:8px 12px;border-radius:8px;font-weight:700}.page-shell{min-height:calc(100vh - 150px);padding:56px 0 80px}.page-heading{margin-bottom:32px;max-width:760px}.page-heading h1{font-size:clamp(32px,5vw,52px);line-height:1.05;margin:7px 0 12px;letter-spacing:-.04em}.page-heading p:not(.eyebrow){font-size:16px;color:var(--muted);margin:0;line-height:1.65}.split-heading{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.eyebrow{font-size:11px!important;letter-spacing:.18em;font-weight:800;color:#555!important;margin:0;text-transform:uppercase}.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 17px;border-radius:10px;text-decoration:none;font-weight:800;border:1px solid transparent;cursor:pointer;transition:.15s;font-size:14px;white-space:nowrap}.button:hover{transform:translateY(-1px)}.button-dark{background:#000;color:#fff;border-color:#000}.button-dark:hover{background:#292929}.button-outline{background:#fff;color:#000;border-color:#bdbdbd}.button-outline:hover{border-color:#000}.button-link{color:#000;background:transparent;padding-left:8px;padding-right:8px}.button-large{min-height:50px;padding:12px 24px}.stat-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;margin-bottom:26px}.stat-card{border:1px solid var(--line);border-radius:var(--radius);padding:23px;background:#fff;box-shadow:0 8px 26px rgba(0,0,0,.025)}.stat-card span,.stat-card small{display:block;color:var(--muted);font-size:13px}.stat-card strong{display:block;font-size:38px;letter-spacing:-.04em;line-height:1.1;margin:10px 0 8px}.stat-primary{background:#000;color:#fff;border-color:#000}.stat-primary span,.stat-primary small{color:#bbb}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 34px rgba(0,0,0,.03)}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 24px;border-bottom:1px solid var(--line)}.panel-header h2{font-size:19px;margin:0 0 4px}.panel-header p{color:var(--muted);margin:0;font-size:13px}.search-form{display:flex;align-items:center;gap:8px}.search-form input{width:260px}.field input,.field select,.search-form input{height:44px;border:1px solid #c9c9c9;border-radius:9px;padding:0 12px;background:#fff;color:#000;outline:none}.field input:focus,.field select:focus,.search-form input:focus{border-color:#000;box-shadow:0 0 0 3px rgba(0,0,0,.08)}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:840px}th,td{text-align:left;padding:15px 18px;border-bottom:1px solid #e8e8e8;vertical-align:middle}th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#666;background:#fafafa;white-space:nowrap}td{font-size:14px}tbody tr:hover{background:#fafafa}tbody tr:last-child td{border-bottom:0}.code-chip,.badge{display:inline-block;border:1px solid #bbb;border-radius:7px;padding:4px 7px;font-weight:700;background:#fff;white-space:nowrap}.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}.text-link,.back-link{color:#000;text-decoration:underline;text-underline-offset:3px;font-weight:700}.table-empty,.empty-state{text-align:center;padding:72px 22px}.table-empty strong,.empty-state h1{font-size:25px;margin:8px 0}.table-empty p,.empty-state p{color:var(--muted);margin:8px auto 22px;max-width:600px;line-height:1.7}.pagination{display:flex;justify-content:center;align-items:center;gap:5px;padding:20px;border-top:1px solid var(--line)}.pagination a{min-width:38px;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center;color:#000;text-decoration:none}.pagination a.active{background:#000;color:#fff;border-color:#000}.alert{padding:15px 18px;border:1px solid;border-radius:12px;margin-bottom:22px}.alert-success{background:#f0fdf4;border-color:#8ed6a8}.alert-error{background:#fff5f5;border-color:#000}.alert-error strong{display:block;margin-bottom:7px}.alert-error ul{margin:0;padding-left:22px}.generator-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}.form-stack{display:grid;gap:20px}.form-panel{padding:26px;display:grid;grid-template-columns:44px 1fr;gap:5px 18px;overflow:visible}.section-number{width:42px;height:42px;border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;font-weight:800;font-size:12px}.section-copy h2{margin:0 0 4px;font-size:20px}.section-copy p{margin:0;color:var(--muted);font-size:13px}.form-grid{grid-column:2;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:21px}.form-grid-3{grid-template-columns:repeat(3,1fr)}.field{display:grid;gap:7px}.field-wide{grid-column:1/-1}.field span{font-weight:800;font-size:13px}.field b{color:#000}.field small{font-size:11px;color:var(--muted);line-height:1.45}.field input,.field select{width:100%;height:47px}.form-actions{display:flex;justify-content:flex-end;gap:10px}.preview-panel{background:#000;color:#fff;border-radius:var(--radius);min-height:500px;overflow:hidden}.preview-sticky{position:sticky;top:100px;padding:30px}.preview-panel .eyebrow{color:#aaa!important}.preview-panel h2{font-size:23px;margin:8px 0 30px}.serial-preview{border:1px solid #444;border-radius:13px;padding:18px;background:#111}.serial-preview small{display:block;color:#aaa;margin-bottom:7px}.serial-preview strong{display:block;font-size:25px;overflow-wrap:anywhere}.range-preview{display:flex;align-items:center;gap:10px;padding:17px 4px 21px;border-bottom:1px solid #333}.range-preview span{color:#999}.range-preview strong{overflow-wrap:anywhere}.preview-summary{margin:0}.preview-summary div{padding:15px 0;border-bottom:1px solid #333}.preview-summary dt{color:#aaa;font-size:11px;margin-bottom:5px}.preview-summary dd{margin:0;font-weight:700;overflow-wrap:anywhere}.preview-note{color:#aaa;font-size:12px;line-height:1.6;margin:22px 0 0}.status-stamp{border:2px solid #000;border-radius:50%;width:112px;height:112px;display:grid;place-items:center;font-weight:800;transform:rotate(-8deg)}.batch-summary{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:24px;background:#000;color:#fff;overflow:hidden}.batch-summary div{padding:22px;border-right:1px solid #3a3a3a}.batch-summary div:last-child{border:0}.batch-summary span{display:block;color:#aaa;font-size:11px;margin-bottom:8px}.batch-summary strong{font-size:19px}.phase-label{font-size:12px;color:#666;border:1px dashed #aaa;padding:6px 9px;border-radius:8px}.payload-cell{font-size:11px;white-space:nowrap}.back-link{display:inline-block;margin-bottom:24px}.event-panel{margin-top:28px;padding:24px;border-left:2px solid #000}.event-panel h2{font-size:19px;margin:0 0 18px}.event-row{display:flex;gap:14px;align-items:center}.event-row>span{width:10px;height:10px;background:#000;border-radius:50%}.event-row strong,.event-row small{display:block}.event-row small{color:var(--muted);margin-top:3px}.site-footer{border-top:1px solid var(--line);color:#666;font-size:12px}.footer-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.generator-layout{grid-template-columns:1fr}.preview-panel{min-height:auto}.preview-sticky{position:static}.form-grid-3{grid-template-columns:1fr 1fr}.stat-grid{grid-template-columns:1fr 1fr}.stat-primary{grid-column:1/-1}.batch-summary{grid-template-columns:1fr 1fr}.batch-summary div:nth-child(2){border-right:0}.batch-summary div:nth-child(-n+2){border-bottom:1px solid #3a3a3a}}
@media(max-width:680px){.container-shell{width:min(100% - 24px,1180px)}.page-shell{padding:36px 0 60px}.header-inner{min-height:66px}.menu-button{display:block}.primary-nav{display:none;position:absolute;top:66px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:12px;flex-direction:column;align-items:stretch}.primary-nav.open{display:flex}.split-heading,.panel-header{align-items:stretch;flex-direction:column}.split-heading .button{width:100%}.page-heading h1{font-size:36px}.stat-grid{grid-template-columns:1fr}.stat-primary{grid-column:auto}.search-form{flex-wrap:wrap}.search-form input{width:100%;flex:1 0 100%}.form-panel{grid-template-columns:1fr;padding:20px}.section-number{margin-bottom:5px}.form-grid{grid-column:1;grid-template-columns:1fr}.form-grid-3{grid-template-columns:1fr}.field-wide{grid-column:auto}.form-actions{flex-direction:column-reverse}.form-actions .button{width:100%}.batch-summary{grid-template-columns:1fr}.batch-summary div{border-right:0;border-bottom:1px solid #3a3a3a!important}.batch-summary div:last-child{border-bottom:0!important}.status-stamp{display:none}.footer-inner{padding:18px 0;align-items:flex-start;flex-direction:column;gap:4px}}

.brand-mark{background:#fff}.brand-mark img{filter:none}.heading-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.heading-actions form{margin:0}.selection-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;background:#f5f5f3;border-bottom:1px solid var(--line)}.selection-bar button:disabled,.button:disabled{opacity:.45;cursor:not-allowed;transform:none}.import-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:24px;align-items:start}.upload-panel{padding:32px;display:grid;gap:18px}.upload-panel h2{font-size:25px;margin:0}.upload-panel>p{color:var(--muted);margin:-12px 0 0}.upload-icon{width:62px;height:62px;border-radius:15px;background:#000;color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900;letter-spacing:.08em}.file-drop{min-height:180px;border:2px dashed #999;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;cursor:pointer;background:#fafafa;transition:.15s}.file-drop:hover,.file-drop.dragging{border-color:#000;background:#f1f1ef}.file-drop input{position:absolute;opacity:0;width:1px;height:1px}.file-drop span{font-weight:800}.file-drop small{color:var(--muted);margin-top:8px}.compact-field{max-width:520px}.import-guide{padding:28px;background:#000;color:#fff}.import-guide .eyebrow,.import-guide p{color:#aaa!important}.import-guide h2{font-size:24px;margin:8px 0 22px}.import-guide dl{margin:0}.import-guide dl div{padding:15px 0;border-bottom:1px solid #333}.import-guide dt{font-size:11px;color:#aaa;margin-bottom:5px}.import-guide dd{margin:0;line-height:1.55}.import-guide>p:last-child{font-size:12px;line-height:1.65;margin:22px 0 0}.import-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}.import-summary-grid article{border:1px solid var(--line);border-radius:13px;background:#fff;padding:18px}.import-summary-grid span{display:block;color:var(--muted);font-size:11px}.import-summary-grid strong{display:block;font-size:26px;margin-top:7px}.import-summary-grid .has-error{border-color:#000;background:#fff5f5}.sheet-picker label{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700}.sheet-picker select{height:38px;border:1px solid #aaa;border-radius:8px;padding:0 9px;background:#fff}.row-error{background:#fff3f3!important}.badge-ok{background:#000;color:#fff;border-color:#000}.badge-error{background:#fff;border-color:#000}.preview-limit-note{margin:0;padding:12px 18px;background:#fafafa;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.import-confirm-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 24px;border-top:1px solid var(--line)}.import-confirm-bar p{margin:4px 0 0;color:var(--muted);font-size:12px}.print-instruction{padding:13px 17px;border:1px solid #000;border-radius:10px;background:#fff;margin-bottom:24px}.label-document{display:grid;gap:26px;overflow:auto;padding:2px 2px 30px}.label-sheet{width:210mm;height:297mm;box-sizing:border-box;padding:8mm;display:grid;grid-template-columns:95.5mm 95.5mm;grid-template-rows:repeat(8,32.5mm);gap:3mm;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.13);margin:0 auto;flex:none}.inventory-label{width:95.5mm;height:32.5mm;border:.45mm solid #000;border-radius:3.2mm;display:grid;grid-template-columns:29mm 41.5mm 25mm;overflow:hidden;background:#fff;color:#000;box-sizing:border-box}.label-logo{display:flex;align-items:center;justify-content:center;border-right:.25mm solid #000;padding:3mm}.label-logo img{width:21mm;height:21mm;object-fit:contain}.label-copy{display:grid;grid-template-rows:11.7mm 8.6mm 1fr;padding:2.6mm 2.6mm 1.8mm}.label-name{font-size:10pt;font-weight:900;line-height:1.2;display:flex;align-items:center;overflow:hidden;border-bottom:.18mm solid #000}.label-code,.label-serial{font-size:7.5pt;font-weight:800;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.label-code{border-bottom:.18mm solid #000}.label-qr{border-left:.25mm solid #000;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5mm}.label-qr img{width:21mm;height:21mm;object-fit:contain;image-rendering:pixelated}.label-qr strong{display:block;max-width:22mm;font-size:6pt;line-height:1.1;margin-top:.5mm;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-print{display:block}
@media(max-width:900px){.import-grid{grid-template-columns:1fr}.import-summary-grid{grid-template-columns:1fr 1fr}.import-confirm-bar{align-items:stretch;flex-direction:column}.heading-actions{align-items:stretch}.heading-actions .button,.heading-actions form,.heading-actions form button{width:100%}}
@media(max-width:680px){.import-summary-grid{grid-template-columns:1fr 1fr}.selection-bar{align-items:stretch;flex-direction:column}.selection-bar .button{width:100%}.label-document{margin-left:-12px;margin-right:-12px}.import-confirm-bar .form-actions{width:100%}.import-confirm-bar form{width:100%}}
@media print{@page{size:A4 portrait;margin:0}html,body{width:210mm;margin:0!important;padding:0!important;background:#fff!important}.site-header,.site-footer,.no-print{display:none!important}.container-shell{width:auto!important;max-width:none!important;margin:0!important}.page-shell{padding:0!important;min-height:0!important}.label-document{display:block!important;overflow:visible!important;padding:0!important}.label-sheet{box-shadow:none!important;margin:0!important;break-after:page;page-break-after:always}.label-sheet:last-child{break-after:auto;page-break-after:auto}}
.split-heading.no-print{display:flex}