:root{--color-bg: #ffffff;--color-surface: #faf9f8;--color-text: #161415;--color-text-muted: #6b6864;--color-text-faint: #8c8884;--color-border: #e3e0dc;--color-border-strong: #d5d1cc;--color-accent: #c4300f;--color-on-accent: #ffffff;--color-brand: #e73f1a;--tap-min: 44px;--font-size-input: 16px;--line-height: 1.6;--weight-normal: 400;--weight-bold: 700;--breakpoint-wide: 768px}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--color-bg: #141413;--color-surface: #1c1b1a;--color-text: #f5f3f1;--color-text-muted: #a3a09c;--color-text-faint: #8c8884;--color-border: #3a3836;--color-border-strong: #4a4746;--color-accent: #f2573a;--color-on-accent: #1a0b06}}:root[data-theme=dark]{--color-bg: #141413;--color-surface: #1c1b1a;--color-text: #f5f3f1;--color-text-muted: #a3a09c;--color-text-faint: #8c8884;--color-border: #3a3836;--color-border-strong: #4a4746;--color-accent: #f2573a;--color-on-accent: #1a0b06}.fallback-page{max-width:560px;margin:0 auto;padding:24px 16px;background:var(--color-bg);color:var(--color-text);font-family:Sarabun,Noto Sans Thai,Tahoma,sans-serif;line-height:var(--line-height)}.fallback-title{margin:0 0 12px;font-size:20px;font-weight:var(--weight-bold)}.fallback-text{margin:0 0 16px;font-size:16px}.fallback-detail{margin:0 0 16px;padding:8px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);font-size:14px;white-space:pre-wrap;word-break:break-word}.fallback-button{min-height:var(--tap-min);padding:8px 16px;border:1px solid var(--color-accent);border-radius:10px;background:var(--color-accent);color:var(--color-on-accent);font-family:inherit;font-size:var(--font-size-input);font-weight:var(--weight-bold);line-height:var(--line-height);cursor:pointer}.auth-page{position:relative;min-height:100vh;padding:56px 16px 64px}.auth-shell{width:100%;max-width:380px;margin:0 auto}.auth-theme-toggle{position:absolute;top:16px;right:16px;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;background:none;color:var(--color-text-muted);cursor:pointer}.auth-icon{display:block;width:20px;height:20px}.auth-brand{text-align:center}.auth-logo{display:block;height:120px;width:auto;margin:0 auto}.auth-logo-placeholder{display:flex;align-items:center;justify-content:center;width:120px;height:120px;margin:0 auto;border:1px dashed var(--color-border-strong);color:var(--color-text-muted);font-size:13px;line-height:var(--line-height)}.auth-company-th{margin:20px 0 0;font-size:20px;font-weight:var(--weight-bold);line-height:var(--line-height)}.auth-company-en{margin:4px 0 0;color:var(--color-text-muted);font-size:13px;font-weight:var(--weight-normal);line-height:var(--line-height)}.auth-form{margin-top:44px}.auth-heading{margin:44px 0 0;font-size:20px;font-weight:var(--weight-bold);line-height:var(--line-height)}.auth-heading+.auth-field,.auth-heading+.auth-message,.auth-heading+.auth-form{margin-top:20px}.auth-field{margin-top:20px}.auth-field:first-child{margin-top:0}.auth-label{display:block;margin:0 0 8px;color:var(--color-text-muted);font-size:14px;font-weight:var(--weight-normal);line-height:var(--line-height)}.auth-input{display:block;width:100%;height:48px;padding:0 12px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:16px;font-weight:var(--weight-normal);line-height:var(--line-height)}.auth-input:disabled{color:var(--color-text-faint)}.auth-input-file{height:auto;min-height:48px;padding:12px}.auth-input-wrap{position:relative}.auth-input-wrap .auth-input{padding-right:48px}.auth-eye-button{position:absolute;top:2px;right:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;background:none;color:var(--color-text-muted);cursor:pointer}.auth-help{margin:8px 0 0;color:var(--color-text-muted);font-size:13px;line-height:var(--line-height)}.auth-rule-list{list-style:none;margin:8px 0 0;padding:0}.auth-rule{display:flex;align-items:flex-start;gap:6px;color:var(--color-accent);font-size:13px;line-height:var(--line-height)}.auth-rule-met{color:var(--color-text-muted)}.auth-rule-icon{flex:0 0 auto;width:14px;height:14px;margin-top:4px}.auth-message{margin:20px 0 0;color:var(--color-text);font-size:14px;line-height:var(--line-height)}.auth-message-error{color:var(--color-accent)}.auth-button-primary{display:block;width:100%;height:50px;margin-top:28px;padding:0 16px;border:1px solid var(--color-accent);border-radius:10px;background:var(--color-accent);color:var(--color-on-accent);font-family:inherit;font-size:16px;font-weight:var(--weight-bold);line-height:var(--line-height);cursor:pointer}.auth-button-primary:disabled{border-color:var(--color-border-strong);background:var(--color-bg);color:var(--color-text-faint);cursor:not-allowed}.auth-link-row{margin-top:20px;text-align:center}.auth-link{display:inline-block;min-height:44px;padding:11px 8px;border:none;background:none;color:var(--color-text-muted);font-family:inherit;font-size:14px;font-weight:var(--weight-normal);line-height:var(--line-height);text-decoration:none;cursor:pointer}.auth-link-accent{color:var(--color-accent)}.auth-link:disabled{color:var(--color-text-faint);cursor:not-allowed}.auth-secondary-row{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:20px;color:var(--color-text-muted);font-size:14px;line-height:var(--line-height)}.auth-photo-preview{display:block;max-width:160px;margin-top:8px;border-radius:10px}.auth-username-echo{margin:20px 0 0;font-size:18px;font-weight:var(--weight-bold);line-height:var(--line-height);word-break:break-all}@media (min-width: 768px){.auth-page{padding-bottom:96px}}*{box-sizing:border-box}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:Sarabun,Noto Sans Thai,Tahoma,sans-serif;font-weight:var(--weight-normal);line-height:var(--line-height)}.po-page{max-width:1100px;margin:0 auto;padding:12px 12px 168px}.po-topbar{padding:8px 4px 12px}.po-title{margin:0;font-size:22px;font-weight:var(--weight-bold);line-height:var(--line-height)}.po-heading{margin:0 0 12px;font-size:18px;font-weight:var(--weight-bold);line-height:var(--line-height)}.po-card{background:var(--color-surface);border:1px solid var(--color-border);padding:12px;margin-bottom:12px}.po-field{margin-bottom:20px}.po-label{display:block;margin-bottom:8px;color:var(--color-text-muted);font-size:14px;font-weight:var(--weight-normal);line-height:var(--line-height)}.po-input{width:100%;max-width:520px;height:48px;padding:0 12px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:16px;font-weight:var(--weight-normal);line-height:var(--line-height)}.po-input:disabled{color:var(--color-text-faint)}.po-textarea{max-width:none;height:auto;min-height:64px;padding:12px;resize:vertical}.po-textarea-remark{min-height:96px}.po-select-wrap{position:relative}.po-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:40px;cursor:pointer}.po-select::-ms-expand{display:none}.po-select-arrow{position:absolute;top:50%;right:12px;width:20px;height:20px;margin-top:-10px;color:var(--color-text-muted);pointer-events:none}.po-input-number,.po-number{font-variant-numeric:tabular-nums}.po-note{margin:0 0 8px;color:var(--color-text-muted);font-size:16px;line-height:var(--line-height)}.po-panel-list,.po-line-list{list-style:none;margin:0;padding:0}.po-search-box{position:relative}.po-panel{position:absolute;top:100%;left:0;z-index:20;width:100%;max-width:520px;max-height:320px;overflow-y:auto;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-surface)}.po-panel-note{margin:0;padding:8px 10px;border-bottom:1px solid var(--color-border);color:var(--color-text-muted);font-size:14px;line-height:var(--line-height)}.po-result{display:block;width:100%;min-height:48px;padding:10px;border:none;border-bottom:1px solid var(--color-border);background:none;color:var(--color-text);font-family:inherit;text-align:left;cursor:pointer}.po-panel-list li:last-child .po-result{border-bottom:none}.po-result-active,.po-result-custom{background:var(--color-bg)}.po-chip-row{display:flex;gap:8px;margin-bottom:12px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}.po-chip{flex:0 0 auto;min-height:36px;padding:6px 14px;border:1px solid var(--color-border-strong);border-radius:18px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:14px;font-weight:var(--weight-normal);line-height:var(--line-height);white-space:nowrap;cursor:pointer}.po-chip-on{border-color:var(--color-accent);background:var(--color-accent);color:var(--color-on-accent);font-weight:var(--weight-bold)}.po-help{margin:8px 0 0;color:var(--color-text-muted);font-size:13px;line-height:var(--line-height)}.po-result-name{display:block;font-size:16px;font-weight:var(--weight-bold);line-height:var(--line-height);overflow-wrap:anywhere}.po-result-meta{display:block;color:var(--color-text-muted);font-size:16px;font-weight:var(--weight-normal);line-height:var(--line-height);overflow-wrap:anywhere}.po-line{position:relative;border:1px solid var(--color-border);border-radius:10px;padding:10px;margin-bottom:10px}.po-line-action{position:absolute;top:6px;right:6px}.po-line-title{padding-right:44px}.po-line-name{display:block;font-size:16px;font-weight:var(--weight-bold);line-height:var(--line-height);overflow-wrap:anywhere}.po-line-meta{display:block;color:var(--color-text-muted);font-size:16px;line-height:var(--line-height);overflow-wrap:anywhere}.po-line-inputs{display:flex;gap:8px;margin-top:20px}.po-line-inputs .po-field{flex:1 1 0;margin-bottom:0}.po-label-inline{font-size:14px}.po-line-figure{display:flex;gap:8px;margin:8px 0 0;font-size:16px;line-height:var(--line-height)}.po-figure-label{color:var(--color-text-muted)}.po-icon-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:50%;background:none;color:var(--color-text-muted);cursor:pointer}.po-icon-button:before{content:"";position:absolute;width:36px;height:36px;border-radius:50%;background:none;transition:background-color .15s ease,transform .15s ease}.po-icon-button:hover{color:var(--color-accent)}.po-icon-button:hover:before{background:var(--color-surface)}.po-icon-button:active:before{transform:scale(.96)}.po-icon-button:focus-visible{outline:none;color:var(--color-accent)}.po-icon-button:focus-visible:before{background:var(--color-surface);box-shadow:0 0 0 2px var(--color-accent)}.po-icon{display:block;position:relative;width:20px;height:20px;transition:color .15s ease}@media (prefers-reduced-motion: reduce){.po-icon-button:before,.po-icon{transition:none}.po-icon-button:active:before{transform:none}}.po-line-error,.po-summary-error{margin:8px 0 0;color:var(--color-accent);font-size:16px;font-weight:var(--weight-normal);line-height:var(--line-height)}.po-button{min-height:44px;padding:8px 14px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:16px;font-weight:var(--weight-normal);line-height:var(--line-height);cursor:pointer}.po-button-submit{width:100%;height:50px;margin-top:8px;border-color:var(--color-accent);background:var(--color-accent);color:var(--color-on-accent);font-weight:var(--weight-bold)}.po-button-submit:disabled{border-color:var(--color-border-strong);background:var(--color-bg);color:var(--color-text-faint);cursor:not-allowed}.po-summary{position:fixed;left:0;right:0;bottom:0;padding:10px 12px;border-top:1px solid var(--color-border-strong);background:var(--color-surface)}.po-summary-figures{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;font-size:16px;line-height:var(--line-height)}.po-summary-net{font-weight:var(--weight-bold)}.po-line-head{display:none}@media (min-width: 768px){.po-page{padding:16px 16px 132px}.po-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}.po-grid-wide{grid-column:1 / -1}.po-line-head,.po-line{display:grid;grid-template-columns:minmax(260px,1fr) 120px 120px 120px 120px 130px 88px;gap:12px;align-items:start}.po-line-head{padding:0 10px 6px;border-left:1px solid transparent;border-right:1px solid transparent;color:var(--color-text-muted);font-size:14px;line-height:var(--line-height)}.po-head-right{text-align:right}.po-head-center{text-align:center}.po-line-inputs{display:contents}.po-line-title{grid-column:1;grid-row:1}.po-cell-price{grid-column:2;grid-row:1}.po-cell-qty{grid-column:3;grid-row:1}.po-cell-free{grid-column:4;grid-row:1}.po-cell-unit{grid-column:5;grid-row:1}.po-cell-amount{grid-column:6;grid-row:1}.po-line-action{position:static;grid-column:7;grid-row:1;align-self:start;justify-self:center;margin-top:2px}.po-line-title{padding-right:0}.po-field-pack{grid-column:1 / -1;grid-row:2;margin-bottom:0}.po-cell-error{grid-column:1 / -1;grid-row:3}.po-line-figure{display:block;margin-top:0;text-align:right}.po-figure-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.po-line-inputs .po-input-number{text-align:right}.po-label-inline{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.po-line-inputs .po-field{margin-bottom:0}}.po-match-box{margin-top:8px;border:1px solid var(--color-border-strong);border-radius:10px;padding:8px;background:var(--color-bg)}.po-match-list{list-style:none;margin:0 0 8px;padding:0}.po-match-list li:last-child .po-result{border-bottom:none}.po-picked{margin:8px 0 0;padding:8px 10px;border-left:3px solid var(--color-accent);background:var(--color-bg);font-size:16px;line-height:var(--line-height)}.po-picked-name{display:block;font-weight:var(--weight-bold)}.po-picked-meta{display:block;color:var(--color-text-muted)}.po-notice{margin-top:8px;padding:8px;border:1px solid var(--color-border-strong);border-radius:10px;background:var(--color-bg)}.po-notice-text{margin:0 0 8px;font-size:16px;line-height:var(--line-height)}.po-alert{margin-bottom:12px;padding:10px;border:1px solid var(--color-accent);border-radius:10px;background:var(--color-surface)}.po-alert-title{margin:0 0 6px;color:var(--color-accent);font-size:16px;font-weight:var(--weight-bold);line-height:var(--line-height)}.po-result-card{margin-bottom:12px}.po-receipt{margin:0 0 12px}.po-receipt-row{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--color-border);font-size:16px;line-height:var(--line-height)}.po-receipt-row dt{color:var(--color-text-muted)}.po-receipt-row dd{margin:0;text-align:right}.po-receipt-strong{font-weight:var(--weight-bold)}.po-result-actions{display:flex;flex-direction:column;gap:8px}.po-copy-preview{margin:12px 0 0;padding:10px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:15px;line-height:var(--line-height);white-space:pre-wrap;word-break:break-word;-webkit-user-select:text;user-select:text}