:root{--canvas:oklch(0.982 0.004 155);--surface:oklch(1 0 0);--surface-subtle:oklch(0.958 0.008 155);--ink:oklch(0.255 0.025 250);--muted:oklch(0.43 0.025 250);--border:oklch(0.84 0.018 250);--primary:oklch(0.545 0.15 152);--primary-strong:oklch(0.465 0.13 152);--primary-soft:oklch(0.95 0.038 152);--on-primary:white;--on-danger:white;--danger:oklch(0.52 0.19 25);--danger-soft:oklch(0.95 0.035 25);--warning:oklch(0.49 0.125 65);--warning-soft:oklch(0.955 0.045 80);--info:oklch(0.48 0.13 250);--info-soft:oklch(0.95 0.035 250);--nav-height:calc(68px + env(safe-area-inset-bottom));--header-height:calc(60px + env(safe-area-inset-top));--radius-sm:8px;--radius-md:12px;--z-sticky:20;color-scheme:light}*{box-sizing:border-box}body,html{background:var(--canvas)}body{margin:0;color:var(--ink);font-family:Noto Sans Thai,Leelawadee UI,Tahoma,system-ui,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}button{color:inherit}h1,h2,h3,p{margin-top:0}h1,h2,h3{text-wrap:balance}h1{font-size:1.5rem;line-height:1.35}h1,h2{margin-bottom:6px}h2{font-size:1.125rem;line-height:1.45}h3{margin-bottom:4px;font-size:1rem;line-height:1.5}p{text-wrap:pretty}dd,h1,h2,h3,p,strong{overflow-wrap:anywhere}svg{flex-shrink:0}:focus-visible{outline:3px solid oklch(.76 .15 152);outline-offset:2px}.app-frame{min-height:100dvh}.app-header{position:sticky;top:0;z-index:var(--z-sticky);justify-content:space-between;gap:12px;min-height:var(--header-height);padding:env(safe-area-inset-top) 16px 0;border-bottom:1px solid var(--border);background:color-mix(in oklch,var(--surface) 96%,transparent)}.app-header,.wordmark{display:flex;align-items:center}.wordmark{min-height:44px;gap:9px;font-weight:700}.brand-mark,.wordmark-mark{display:grid;place-items:center;flex:0 0 auto;background:var(--primary);color:var(--on-primary);font-weight:800}.wordmark-mark{width:30px;height:30px;border-radius:9px;font-size:.9rem}.account-summary{display:flex;align-items:center;gap:4px;min-width:0}.account-name{display:none;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:.875rem}.icon-button{display:inline-grid;min-width:44px;min-height:44px;place-items:center;border:0;border-radius:var(--radius-md);background:transparent;cursor:pointer}.icon-button:hover{background:var(--surface-subtle)}.app-main{width:min(100%,760px);margin:0 auto;padding:24px 16px calc(var(--nav-height) + 28px)}.bottom-nav{position:fixed;right:0;bottom:0;left:0;z-index:var(--z-sticky);display:grid;grid-template-columns:repeat(3,1fr);min-height:var(--nav-height);padding:7px max(8px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px,env(safe-area-inset-left));border-top:1px solid var(--border);background:var(--surface)}.bottom-nav a{display:flex;min-height:52px;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:var(--radius-md);color:var(--muted);font-size:.75rem;font-weight:600}.bottom-nav a.active{color:var(--primary-strong);background:var(--primary-soft)}.page-header{display:flex;flex-direction:column;align-items:stretch;gap:16px;margin-bottom:24px}.page-header p{margin-bottom:0;color:var(--muted)}.page-heading-row{display:flex;align-items:flex-start;gap:8px}.page-heading-row>div{min-width:0;flex:1 1}.page-heading-row>.icon-button{margin-left:-10px}.greeting{margin-bottom:18px;color:var(--muted);font-size:.9rem}.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius-md);border:1px solid transparent;font-weight:700;cursor:pointer;transition:background-color .18s ease-out,color .18s ease-out,border-color .18s ease-out}.button:disabled{cursor:not-allowed;opacity:.58}.button-primary{background:var(--primary);color:var(--on-primary)}.button-primary:hover:not(:disabled){background:var(--primary-strong)}.button-secondary{border-color:var(--border);background:var(--surface);color:var(--ink)}.button-secondary:hover:not(:disabled){background:var(--surface-subtle)}.button-danger{background:var(--danger);color:var(--on-danger)}.button-ghost-danger{background:var(--danger-soft);color:var(--danger)}.button-block{width:100%}.button-row{display:flex;flex-wrap:wrap;gap:10px}.text-link{color:var(--primary-strong);font-weight:700;text-decoration:underline;text-underline-offset:3px}.danger-link{color:var(--danger)}.section{padding:20px 0;border-top:1px solid var(--border)}.section:first-of-type{border-top:0}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.section-heading p{margin:2px 0 0;color:var(--muted);font-size:.875rem}.surface{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.surface+.surface{margin-top:12px}.surface-body{padding:16px}.surface-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--border)}.surface-header p{margin-bottom:0;color:var(--muted);font-size:.875rem}.job-list{display:flex;flex-direction:column;gap:12px}.job-row{display:block;padding:17px 16px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.job-row:hover{border-color:color-mix(in oklch,var(--primary) 60%,var(--border))}.job-row-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.job-row h2{margin-bottom:2px}.job-row-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin:12px 0 0;color:var(--muted);font-size:.875rem}.job-row-meta span{gap:5px}.job-row-meta span,.status{display:inline-flex;align-items:center}.status{min-height:28px;border-radius:999px;padding:3px 10px;font-size:.78rem;font-weight:700;white-space:nowrap}.status-success{background:var(--primary-soft);color:var(--primary-strong)}.status-warning{background:var(--warning-soft);color:var(--warning)}.status-danger{background:var(--danger-soft);color:var(--danger)}.status-info{background:var(--info-soft);color:var(--info)}.field{display:flex;min-width:0;flex-direction:column;gap:6px}.field+.field{margin-top:15px}.field-row{display:grid;grid-template-columns:minmax(0,1fr);gap:15px}.field-row .field+.field{margin-top:0}.field+.field-row,.field-row+.field,.field-row+.field-row{margin-top:15px}.field label>.input{display:block;margin-top:6px}.field label,.field-label{font-size:.875rem;font-weight:700}.required{color:var(--danger)}.hint{margin:0;color:var(--muted);font-size:.8rem}.input,.select,.textarea{width:100%;min-height:48px;padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);color:var(--ink)}.textarea{min-height:104px;resize:vertical}.input::placeholder,.textarea::placeholder{color:var(--muted);opacity:1}.input:hover,.select:hover,.textarea:hover{border-color:var(--muted)}.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);outline:3px solid color-mix(in oklch,var(--primary) 25%,transparent)}.select:disabled,input.input[readonly],select.input:disabled{background:var(--surface-subtle);color:var(--muted)}select:disabled{cursor:not-allowed;opacity:1}.checkbox-row{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:8px 0}.checkbox-row input{width:20px;height:20px;margin-top:2px;accent-color:var(--primary)}.form-actions{display:flex;flex-direction:column;gap:10px;margin-top:24px}.form-error{margin-top:14px;color:var(--danger);font-size:.875rem}.clip-editor{padding:18px 0;border-top:1px solid var(--border)}.clip-editor:first-child{border-top:0;padding-top:0}.clip-editor-title{justify-content:space-between;gap:12px;margin-bottom:14px}.clip-editor-title,.upload-box{display:flex;align-items:center}.upload-box{position:relative;min-height:70px;gap:10px;padding:12px;border:1px dashed var(--border);border-radius:var(--radius-md);background:var(--surface-subtle)}.upload-box input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.upload-box>span{min-width:0;overflow-wrap:anywhere}.choice:has(input:focus-visible),.upload-box:has(input:focus-visible){outline:3px solid var(--primary);outline-offset:3px}.upload-box:has(input:disabled){cursor:wait}.upload-box input:disabled{cursor:wait}.upload-box.uploading{opacity:.7}.upload-file{display:flex;align-items:center;gap:7px;margin:8px 0 0;color:var(--primary-strong);font-size:.875rem;overflow-wrap:anywhere}.notice{margin:0 0 16px;padding:12px 14px;border-radius:var(--radius-sm);font-size:.9rem}.notice-success{background:var(--primary-soft);color:var(--primary-strong)}.notice-error{background:var(--danger-soft);color:var(--danger)}.notice-warning{background:var(--warning-soft);color:var(--warning)}.notice-info{background:var(--info-soft);color:var(--info)}.center-screen,.page-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.center-screen{min-height:100dvh;padding:28px}.center-screen p,.page-state p{max-width:34rem;color:var(--muted)}.page-state{min-height:280px;padding:32px 20px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.page-state .button{margin-top:10px}.loader{width:34px;height:34px;margin-bottom:14px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.error-ink{color:var(--danger)}.login-page{display:grid;min-height:100dvh;place-items:center;padding:28px 18px;background:var(--canvas)}.login-panel{width:min(100%,440px);padding:32px 24px;border:1px solid var(--border);border-radius:16px;background:var(--surface);text-align:center}.brand-mark{width:52px;height:52px;margin:0 auto 10px;border-radius:14px;font-size:1.45rem}.brand-name{margin-bottom:26px;color:var(--muted);font-size:.875rem;font-weight:700}.login-panel h1{font-size:1.75rem}.login-copy{margin:0 auto 26px;max-width:34ch;color:var(--muted)}.line-button{display:flex;width:100%;min-height:52px;align-items:center;justify-content:center;gap:10px;border:0;border-radius:var(--radius-md);background:#06c755;color:#052e16;font-weight:800;cursor:pointer}.line-button:hover{background:#05ad4b}.line-icon{font-size:.67rem;font-weight:900}.privacy-note{margin:18px auto 0;color:var(--muted);font-size:.8rem}.activity-row>div,.change-row>div,.clip-detail-head>div,.document-row>div,.job-row-top>div,.payment-row>div,.shipment-row>div{min-width:0}.document-row>.icon-button{flex:0 0 44px}.wht-upload-form{display:flex;flex-direction:column;gap:12px;margin-top:16px}.detail-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.meta-grid{display:grid;grid-template-columns:1fr;gap:12px}.meta-item dt{color:var(--muted);font-size:.8rem}.meta-item dd{margin:2px 0 0;font-weight:600}.money{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:800}.quotation-total{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:14px 0;border-top:1px solid var(--border)}.quotation-items dd{margin:0;white-space:nowrap}.quotation-items{margin:0;padding:0;list-style:none}.quotation-items li,.quotation-items>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0}.clip-detail+.clip-detail{border-top:1px solid var(--border)}.clip-detail{padding:16px}.clip-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.draft-panel{margin-top:14px;padding:14px;border-radius:var(--radius-sm);background:var(--surface-subtle)}.draft-panel .button-row{margin-top:12px}.inline-form{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{position:relative;display:flex;min-height:48px;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);font-weight:700}.choice input{position:absolute;opacity:0}.choice:has(input:checked){border-color:var(--primary);background:var(--primary-soft);color:var(--primary-strong)}.activity-row,.change-row,.document-row,.payment-row,.shipment-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--border)}.activity-row:first-child,.change-row:first-child,.document-row:first-child,.payment-row:first-child,.shipment-row:first-child{border-top:0}.activity-row p,.change-row p,.document-row p,.payment-row p,.shipment-row p{margin:2px 0 0;color:var(--muted);font-size:.825rem}.overdue{display:flex;align-items:flex-start;gap:8px}@keyframes spin{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){*,:after,:before{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (min-width:560px){.account-name{display:block}.page-header{flex-direction:row;align-items:flex-start;justify-content:space-between}.page-header>.button{flex:0 0 auto}.field-row,.meta-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.form-actions{flex-direction:row-reverse;justify-content:flex-start}.form-actions .button{min-width:180px}}@media (min-width:880px){.app-header{padding-right:max(24px,calc((100% - 920px) / 2));padding-left:max(24px,calc((100% - 920px) / 2))}.app-main{width:min(100%,920px);padding:34px 24px 48px}.bottom-nav{position:static;width:min(100%,920px);min-height:auto;margin:-2px auto 0;padding:0 24px;border-top:0;border-bottom:1px solid var(--border);background:transparent}.bottom-nav a{flex-direction:row;min-height:52px;border-radius:0;border-bottom:2px solid transparent;background:transparent!important;font-size:.875rem}.bottom-nav a.active{border-bottom-color:var(--primary)}}@media (prefers-color-scheme:dark){:root{--canvas:oklch(0.17 0.018 250);--surface:oklch(0.225 0.022 250);--surface-subtle:oklch(0.27 0.025 250);--ink:oklch(0.94 0.01 250);--muted:oklch(0.75 0.02 250);--border:oklch(0.37 0.025 250);--on-primary:oklch(0.17 0.018 250);--on-danger:oklch(0.17 0.018 250);--primary:oklch(0.69 0.16 152);--primary-strong:oklch(0.79 0.14 152);--primary-soft:oklch(0.3 0.07 152);--danger:oklch(0.72 0.17 25);--danger-soft:oklch(0.29 0.07 25);--warning:oklch(0.79 0.12 75);--warning-soft:oklch(0.3 0.06 75);--info:oklch(0.78 0.11 250);--info-soft:oklch(0.3 0.055 250);color-scheme:dark}.line-button{color-scheme:light}}.app-main [id]{scroll-margin-top:calc(var(--header-height) + 16px)}.app-main .text-link,.app-main summary{min-height:44px}.app-main .text-link{display:inline-flex;align-items:center;gap:5px}.app-main summary{padding-block:10px;cursor:pointer;font-weight:700}.next-action{margin-bottom:20px;border-color:var(--primary)}.next-action p{max-width:70ch}.settled-details{border-top:1px solid var(--border);padding-block:10px}.settled-details>summary{color:var(--ink)}.decision-check{margin-top:14px;padding-block:14px;border-block:1px solid var(--border)}.decision-check p{max-width:70ch}.document-download{flex:0 1 auto;min-width:44px;max-width:100%}.document-download p{max-width:30ch;overflow-wrap:anywhere}.brief-draft-status{margin-bottom:18px}.brief-support{margin-top:16px;border-top:1px solid var(--border)}.brief-support>summary{color:var(--muted)}.brief-support[open]>summary{margin-bottom:10px}.brief-undo{margin-block:12px;padding:12px;background:var(--info-soft);color:var(--info);border-radius:var(--radius-sm)}.settled-details>summary{padding-inline:16px}.brief-draft-status>p{color:var(--muted);font-size:.875rem;margin-bottom:4px}.brief-draft-status>.button-ghost-danger{background:transparent;padding-inline:0}.page-loading{padding-block:24px;color:var(--muted)}.loading-placeholder{display:flex;flex-direction:column;gap:14px;padding-top:10px}.loading-placeholder span{display:block;height:24px;border-radius:var(--radius-sm);background:var(--surface-subtle);animation:loading-fade 1.6s ease-in-out infinite alternate}.loading-placeholder span:first-child{width:55%}.loading-placeholder span:last-child{height:140px}@keyframes loading-fade{0%{opacity:.55}to{opacity:1}}@media (prefers-reduced-motion:reduce){.loading-placeholder span{animation:none}}