/* /promptprint_liff_apps/static/src/css/tokens.css */
 :root{--pp-magenta: #EC008C; --pp-magenta-2: #FF2AA4; --pp-yellow: #FFC400; --pp-cyan: #00B8D4; --pp-blue: #1A4FCF; --pp-blue-2: #2A5FE0; --pp-ink: #0F1A3A; --pp-mute: #6B7795; --pp-line: #DFE4EF; --pp-bg: #F6F8FC; --pp-paper: #FFFFFF; --pp-line-green: #06C755; --pp-line-green-2: #05B34B; --pp-magenta-rgb: 236, 0, 140; --pp-ink-rgb: 15, 26, 58; --pp-line-green-rgb: 6, 199, 85; --pp-cmyk-stripe: linear-gradient( 90deg, var(--pp-cyan) 0 25%, var(--pp-magenta) 25% 50%, var(--pp-yellow) 50% 75%, var(--pp-ink) 75% 100% ); --pp-font-sans: "Prompt", "Noto Sans Thai", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --pp-w-body: 500; --pp-w-emph: 700; --pp-w-head: 800; --pp-w-display: 900; --pp-ls-tight: -0.018em; --pp-ls-normal: 0; --pp-ls-upper: 0.14em; --pp-fs-micro: 11.5px; --pp-fs-xs: 12.5px; --pp-fs-sm: 13.5px; --pp-fs-md: 14px; --pp-fs-lg: 16px; --pp-fs-xl: 20px; --pp-fs-2xl: clamp(22px, 5vw, 28px); --pp-fs-3xl: clamp(26px, 6.5vw, 36px); --pp-fs-4xl: clamp(32px, 8vw, 48px); --pp-lh-tight: 1.15; --pp-lh-normal: 1.45; --pp-lh-loose: 1.6; --pp-r-xs: 6px; --pp-r-sm: 8px; --pp-r-md: 12px; --pp-r-lg: 16px; --pp-r-xl: 20px; --pp-r-pill: 999px; --pp-shadow-card: 0 20px 48px -20px rgba(var(--pp-ink-rgb), 0.20); --pp-shadow-btn: 0 14px 28px -10px rgba(var(--pp-magenta-rgb), 0.50); --pp-shadow-line: 0 14px 28px -10px rgba(var(--pp-line-green-rgb), 0.45); --pp-shadow-sm: 0 2px 6px rgba(var(--pp-ink-rgb), 0.06); --pp-shadow-pop: 0 8px 24px -6px rgba(var(--pp-ink-rgb), 0.18); --pp-space-1: 4px; --pp-space-2: 8px; --pp-space-3: 12px; --pp-space-4: 16px; --pp-space-5: 20px; --pp-space-6: 24px; --pp-space-8: 32px; --pp-space-10: 40px; --pp-space-12: 48px; --pp-space-16: 64px; --pp-tap-min: 44px; --pp-tap-comfy: 48px; --pp-safe-top: env(safe-area-inset-top, 0px); --pp-safe-bottom: env(safe-area-inset-bottom, 0px); --pp-safe-left: env(safe-area-inset-left, 0px); --pp-safe-right: env(safe-area-inset-right, 0px); --pp-ease: cubic-bezier(0.2, 0.7, 0.2, 1); --pp-ease-out: cubic-bezier(0.16, 1, 0.3, 1); --pp-dur-fast: .12s; --pp-dur: .15s; --pp-dur-slow: .25s; --pp-z-header: 100; --pp-z-sticky: 200; --pp-z-overlay: 900; --pp-z-modal: 1000; --pp-z-toast: 1100;}@media (prefers-reduced-motion: reduce){:root{--pp-dur-fast: 0s; --pp-dur: 0s; --pp-dur-slow: 0s;}}

/* /promptprint_liff_apps/static/src/css/components.css */
 .pp-page{font-family: var(--pp-font-sans); font-weight: var(--pp-w-body); font-size: var(--pp-fs-md); line-height: var(--pp-lh-normal); color: var(--pp-ink); background: var(--pp-bg); padding-top: var(--pp-safe-top); padding-bottom: var(--pp-safe-bottom); padding-left: var(--pp-safe-left); padding-right: var(--pp-safe-right); -webkit-tap-highlight-color: transparent;}.pp-h1{font-weight: var(--pp-w-head); font-size: var(--pp-fs-4xl); line-height: var(--pp-lh-tight); letter-spacing: var(--pp-ls-tight);}.pp-h2{font-weight: var(--pp-w-head); font-size: var(--pp-fs-3xl); line-height: var(--pp-lh-tight); letter-spacing: var(--pp-ls-tight);}.pp-h3{font-weight: var(--pp-w-head); font-size: var(--pp-fs-2xl); line-height: var(--pp-lh-tight);}.pp-title{font-weight: var(--pp-w-emph); font-size: var(--pp-fs-xl); line-height: var(--pp-lh-tight);}.pp-muted{color: var(--pp-mute);}.pp-numeric{font-weight: var(--pp-w-display); font-variant-numeric: tabular-nums;}.pp-btn{display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: var(--pp-tap-min); padding: 12px 18px; border-radius: var(--pp-r-md); font-family: inherit; font-weight: var(--pp-w-head); font-size: var(--pp-fs-sm); line-height: 1; text-decoration: none; cursor: pointer; border: none; transition: background var(--pp-dur) var(--pp-ease), transform var(--pp-dur-fast) var(--pp-ease);}.pp-btn:active{transform: scale(0.98);}.pp-btn:disabled{opacity: 0.5; cursor: not-allowed;}.pp-btn--primary{background: var(--pp-magenta); color: #fff; box-shadow: var(--pp-shadow-btn);}.pp-btn--primary:hover{background: var(--pp-magenta-2);}.pp-btn--line{background: var(--pp-line-green); color: #fff; box-shadow: var(--pp-shadow-line);}.pp-btn--line:hover{background: var(--pp-line-green-2);}.pp-btn--ghost{background: transparent; color: var(--pp-ink); border: 1px solid var(--pp-line);}.pp-btn--ghost:hover{background: var(--pp-bg);}.pp-btn--ghost-dark{background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.35);}.pp-btn--block{width: 100%;}.pp-eyebrow{display: inline-block; font-size: var(--pp-fs-micro); letter-spacing: var(--pp-ls-upper); text-transform: uppercase; font-weight: var(--pp-w-head); padding: 4px 11px; border-radius: var(--pp-r-pill);}.pp-eyebrow--magenta{color: var(--pp-magenta); background: #fdeaf4;}.pp-eyebrow--cyan{color: var(--pp-cyan); background: #e0f6fa;}.pp-eyebrow--yellow{color: #a87a00; background: #fff6da;}.pp-eyebrow--blue{color: var(--pp-blue); background: #eef3ff;}.pp-eyebrow--ink{color: var(--pp-ink); background: #e9edf7;}.pp-cmyk-stripe{height: 4px; background: var(--pp-cmyk-stripe);}.pp-card{background: var(--pp-paper); border: 1px solid var(--pp-line); border-radius: var(--pp-r-lg); padding: var(--pp-space-5);}.pp-card--elevated{border: none; box-shadow: var(--pp-shadow-card);}.pp-row{display: flex; align-items: center; gap: var(--pp-space-3); min-height: var(--pp-tap-comfy); padding: var(--pp-space-3) var(--pp-space-4); background: var(--pp-paper); border-bottom: 1px solid var(--pp-line); color: var(--pp-ink); text-decoration: none;}.pp-row:active{background: var(--pp-bg);}.pp-row__main{flex: 1; min-width: 0;}.pp-row__meta{color: var(--pp-mute); font-size: var(--pp-fs-xs);}.pp-sticky-cta{position: sticky; bottom: 0; left: 0; right: 0; padding: var(--pp-space-3) var(--pp-space-4); padding-bottom: calc(var(--pp-space-3) + var(--pp-safe-bottom)); background: var(--pp-paper); border-top: 1px solid var(--pp-line); box-shadow: 0 -4px 14px rgba(var(--pp-ink-rgb), 0.06); z-index: var(--pp-z-sticky);}.pp-sheet{position: fixed; left: 0; right: 0; bottom: 0; background: var(--pp-paper); border-top-left-radius: var(--pp-r-xl); border-top-right-radius: var(--pp-r-xl); box-shadow: var(--pp-shadow-pop); padding: var(--pp-space-5); padding-bottom: calc(var(--pp-space-5) + var(--pp-safe-bottom)); z-index: var(--pp-z-modal); transform: translateY(0); transition: transform var(--pp-dur-slow) var(--pp-ease-out);}.pp-sheet[hidden]{transform: translateY(100%); display: block;}.pp-sheet__grabber{width: 36px; height: 4px; margin: 0 auto var(--pp-space-3); border-radius: var(--pp-r-pill); background: var(--pp-line);}.pp-overlay{position: fixed; inset: 0; background: rgba(var(--pp-ink-rgb), 0.45); z-index: var(--pp-z-overlay);}.pp-btn:focus-visible, .pp-row:focus-visible, .pp-input:focus-visible{outline: 2px solid var(--pp-magenta); outline-offset: 2px;}.pp-stack{display: flex; flex-direction: column; gap: var(--pp-space-4);}.pp-stack--sm{gap: var(--pp-space-2);}.pp-stack--lg{gap: var(--pp-space-6);}.pp-input{width: 100%; box-sizing: border-box; min-height: var(--pp-tap-min); padding: 11px 13px; border: 1px solid var(--pp-line); background: var(--pp-paper); border-radius: var(--pp-r-sm); font-family: inherit; font-size: var(--pp-fs-md); color: var(--pp-ink); transition: border-color var(--pp-dur) var(--pp-ease), box-shadow var(--pp-dur) var(--pp-ease);}.pp-input:focus{outline: none; border-color: var(--pp-magenta); box-shadow: 0 0 0 3px rgba(var(--pp-magenta-rgb), 0.12);}.pp-input:disabled{background: var(--pp-bg); color: var(--pp-mute); cursor: not-allowed;}.pp-input--textarea{min-height: 88px; resize: vertical; line-height: var(--pp-lh-normal);}.pp-input--error{border-color: #c1272d;}.pp-input--error:focus{box-shadow: 0 0 0 3px rgba(193, 39, 45, 0.12);}.pp-input__label{display: block; font-size: var(--pp-fs-xs); font-weight: var(--pp-w-head); color: var(--pp-mute); margin-bottom: 6px; letter-spacing: 0.2px;}.pp-input__counter{display: block; text-align: right; margin-top: 4px; font-size: 11px; color: var(--pp-mute); font-variant-numeric: tabular-nums;}.pp-input__error-msg{display: block; margin-top: 4px; font-size: var(--pp-fs-xs); color: #c1272d; font-weight: var(--pp-w-emph);}.pp-input-group{position: relative;}.pp-input-group > .pp-input{padding-right: 60px;}.pp-input-group > .pp-input-group__suffix{position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--pp-mute); font-size: var(--pp-fs-xs); font-weight: var(--pp-w-emph); pointer-events: none;}.pp-field-row{display: grid; gap: var(--pp-space-2); grid-template-columns: 1fr 1fr;}.pp-field-row--3{grid-template-columns: 1fr 1fr auto;}

/* /promptprint_liff_apps/static/src/css/liff_apps.css */
 .chip-button{display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: var(--pp-r-pill); background: var(--pp-paper); border: 1px solid var(--pp-line); font-size: var(--pp-fs-xs); font-weight: var(--pp-w-emph); color: var(--pp-ink); cursor: pointer; white-space: nowrap; user-select: none; transition: background var(--pp-dur) var(--pp-ease), color var(--pp-dur) var(--pp-ease), border-color var(--pp-dur) var(--pp-ease);}.chip-button:active{transform: scale(0.97);}.chip-button--active{background: var(--pp-ink); color: #fff; border-color: var(--pp-ink);}.chip-button .chip-count{background: var(--pp-bg); color: var(--pp-mute); padding: 1px 6px; border-radius: var(--pp-r-pill); font-size: 10.5px; font-weight: var(--pp-w-display);}.chip-button--active .chip-count{background: rgba(255,255,255,0.18); color: #fff;}.ptype-chip{display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: var(--pp-r-pill); font-size: 10.5px; font-weight: var(--pp-w-head); background: var(--pp-bg); color: var(--pp-ink); border: 1px solid var(--pp-line); white-space: nowrap;}.ptype-dot{width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;}.stage-badge{display: inline-block; padding: 2px 9px; border-radius: var(--pp-r-pill); font-size: 10.5px; font-weight: var(--pp-w-head); letter-spacing: 0.3px; background: #eef3ff; color: var(--pp-blue); white-space: nowrap;}.qo-state{display: inline-block; padding: 2px 9px; border-radius: var(--pp-r-pill); font-size: 10.5px; font-weight: var(--pp-w-head); letter-spacing: 0.3px; white-space: nowrap;}.qo-state--draft{background: #e9edf7; color: var(--pp-mute);}.qo-state--waiting, .qo-state--edit_quote, .qo-state--quoted, .qo-state--quotation, .qo-state--sent{background: #eef3ff; color: var(--pp-blue);}.qo-state--approved, .qo-state--sale{background: #fff6da; color: #a87a00;}.qo-state--saleorder, .qo-state--completed, .qo-state--done{background: #fdeaf4; color: var(--pp-magenta);}.qo-state--cancel{background: #e9edf7; color: var(--pp-mute); text-decoration: line-through;}.inv-state{display: inline-block; padding: 2px 9px; border-radius: var(--pp-r-pill); font-size: 10.5px; font-weight: var(--pp-w-head); letter-spacing: 0.3px; white-space: nowrap;}.inv-state--not_paid{background: #fce3e3; color: #c1272d;}.inv-state--partial{background: #fff6da; color: #a87a00;}.inv-state--in_payment{background: #eef3ff; color: var(--pp-blue);}.inv-state--paid{background: #d6f5e2; color: #058748;}.inv-state--reversed{background: #e9edf7; color: var(--pp-mute);}