:root{--fg:#1d1d1f;--fg-2:#424245;--muted:#6e6e73;--muted-2:#86868b;--fill:#f5f5f7;--fill-2:#f7f7f7;--hairline:#e8e8ed;--hairline-2:#d2d2d7;--accent:#16a34a;--accent-dark:#15803d;--accent-soft:#f0fdf4;--accent-border:#bbf7d0;--accent-text:#166534;--danger:#b42318;--danger-soft:#fef3f2;--danger-border:#fecdca;--dock-space:132px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:#fff;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Helvetica Neue,Arial,sans-serif;color:var(--fg);-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}.ap-flow{max-width:480px;margin:0 auto;padding-bottom:var(--dock-space)}.ap-header{padding:26px 20px 18px;text-align:center;border-bottom:1px solid var(--hairline)}.ap-header.has-bg,.ap-header.has-bg>:not(.ap-header-bg){position:relative}.ap-header-bg{position:absolute;inset:0;background-position:top;background-size:cover;background-repeat:no-repeat;opacity:.5;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,1) 0,rgba(0,0,0,.45) 55%,rgba(0,0,0,0));mask-image:linear-gradient(180deg,rgba(0,0,0,1) 0,rgba(0,0,0,.45) 55%,rgba(0,0,0,0))}.ap-header .eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);font-weight:600}.ap-header h4{font-size:22px;font-weight:600;margin:6px 0 8px;letter-spacing:-.02em}.ap-meta{font-size:12.5px;color:var(--muted);line-height:1.6}.ap-meta b{color:var(--fg);font-weight:600}.ap-pills{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}.ap-pill{background:var(--fill);color:var(--fg-2);border-radius:980px;padding:5px 12px;font-size:11.5px;font-weight:600;letter-spacing:.01em;white-space:nowrap}.ap-pill.accent{background:var(--accent-soft);color:var(--accent-text)}.ap-board-link{display:inline-block;margin-top:12px;font-size:12.5px;font-weight:600;color:var(--accent-dark);text-decoration:none}.ap-board-link:hover{text-decoration:underline}.ap-product{padding:22px 20px;gap:16px;border-bottom:1px solid var(--hairline)}.ap-product,.ap-thumb{display:flex;align-items:center}.ap-thumb{width:84px;height:84px;border-radius:16px;background:linear-gradient(180deg,#f5f5f7,#eceef0);justify-content:center;font-size:34px;flex-shrink:0;overflow:hidden}.ap-thumb img{width:100%;height:100%;object-fit:cover}.ap-pinfo{flex:1;min-width:0}.ap-pinfo .name{font-size:15px;font-weight:600;letter-spacing:-.01em;margin-bottom:2px}.ap-pinfo .unit{font-size:11.5px;color:var(--muted-2);margin-bottom:6px}.ap-pinfo .price{font-size:14px;font-weight:500;color:var(--fg)}.ap-pinfo .unavailable{margin-top:4px;font-size:11.5px;font-weight:600;color:var(--danger)}.ap-stepper{gap:14px}.ap-step-btn,.ap-stepper{display:flex;align-items:center}.ap-step-btn{width:32px;height:32px;border-radius:50%;border:1px solid var(--hairline-2);background:#fff;justify-content:center;font-size:17px;line-height:1;color:var(--fg);padding:0}.ap-step-btn:disabled{color:#c7c7cc;border-color:var(--hairline)}.ap-step-val{font-size:14px;font-weight:600;min-width:12px;text-align:center}.ap-section-label{padding:22px 20px 6px;font-size:19px;font-weight:600;letter-spacing:-.02em}.ap-field{padding:0 20px;margin-bottom:16px}.ap-field label{display:block;font-size:11.5px;color:var(--muted);font-weight:600;margin-bottom:6px;letter-spacing:.01em}.ap-input{width:100%;padding:12px 14px;border:none;border-radius:12px;background:var(--fill);font-family:inherit;font-size:16px;color:var(--fg)}.ap-input:focus{outline:2px solid var(--hairline-2);outline-offset:1px}.ap-hint{font-size:11.5px;color:var(--muted-2);margin-top:6px;line-height:1.5}.ap-hint.warn{color:var(--danger)}.ap-notes{margin:16px 20px 0;padding:14px 16px;border-radius:14px;background:var(--fill);font-size:13px;line-height:1.6;color:var(--fg-2)}.ap-notes p{margin:0 0 10px}.ap-notes p:last-child{margin-bottom:0}.saved-line{text-align:center;font-size:12.5px;font-weight:600;color:var(--accent-text);background:var(--accent-soft);border-radius:10px;padding:8px 12px;margin-bottom:12px}.ap-jalan-grid{display:flex;flex-wrap:wrap;gap:8px}.ap-jalan-pill{padding:10px 16px;border:none;border-radius:10px;background:var(--fill);font-size:13px;font-weight:500;color:var(--fg);min-width:44px;text-align:center}.ap-jalan-pill.sel{background:var(--fg);color:#fff}.ap-summary{margin:20px;padding:18px;border-radius:16px;background:var(--fill)}.ap-srow{gap:12px;font-size:13px;color:var(--fg-2);padding:4px 0}.ap-srow,.ap-stotal{display:flex;justify-content:space-between}.ap-stotal{font-size:17px;font-weight:700;padding-top:10px;margin-top:6px;border-top:1px solid var(--hairline-2)}.ap-fine{font-size:11.5px;color:var(--muted-2);margin-top:8px}.ap-summary .discount-note{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:var(--accent-text);padding:4px 0}.ap-sticky{padding:12px 20px calc(16px + env(safe-area-inset-bottom, 0px));background:rgba(255,255,255,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:space-between;gap:12px}.ap-dock,.ap-sticky{position:fixed;left:0;right:0;bottom:0;z-index:20}.ap-dock>.ap-sticky{position:static}.ap-sticky-total{font-size:15px;font-weight:700}.ap-sticky-count{font-size:11px;color:var(--muted)}.ap-cta{background:var(--accent);color:#fff;border:none;border-radius:980px;padding:13px 26px;font-size:14px;font-weight:600}.ap-cta:disabled{background:#c8c8cd;color:#fff}.ap-cta.full{width:100%;text-align:center;padding:15px}.ap-error{background:var(--danger-soft);border-top:1px solid var(--danger-border);color:var(--danger);font-size:12.5px;line-height:1.5;font-weight:500;padding:12px 20px}.phone-body{max-width:480px;margin:0 auto;padding:20px 18px calc(24px + env(safe-area-inset-bottom, 0px));min-height:100vh;display:flex;flex-direction:column}.checkmark{width:56px;height:56px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;margin:8px auto 14px}.headline{font-size:17px;font-weight:700}.headline,.subline{text-align:center;margin-bottom:4px}.subline{font-size:13px;color:var(--muted)}.saved-banner{background:var(--accent-soft);border:1px solid var(--accent-border);color:var(--accent-text);font-size:12.5px;text-align:center;padding:8px 10px;border-radius:8px;margin:14px 0 18px}.pay-btn{display:block;width:100%;background:var(--accent);color:#fff;border:none;border-radius:10px;padding:14px;font-size:14.5px;font-weight:700;margin-bottom:10px;text-align:center}.pay-btn:disabled{background:#c8c8cd}.later-btn{display:block;width:100%;background:#fff;color:#444;border:1.5px solid #ddd;border-radius:10px;padding:12px;font-size:13.5px;font-weight:600}.later-btn,.pay-note{text-align:center;margin-bottom:12px}.pay-note{font-size:12px;border-radius:8px;padding:8px 10px;background:var(--fill);color:var(--muted)}.pay-note.ok{background:var(--accent-soft);color:var(--accent-text)}.pay-note.bad{background:var(--danger-soft);color:var(--danger)}.board-link{display:block;text-align:center;font-size:13px;font-weight:600;color:var(--accent-dark);text-decoration:none;padding:10px 0 4px}.link-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--fill-2);border-radius:8px;padding:10px;font-size:11.5px;color:var(--muted);margin-top:auto}.link-row .link-label{flex:1 1 auto}.link-row .copy-chip{margin-left:auto;background:#fff;border:1px solid #ddd;border-radius:6px;padding:6px 10px;font-size:11px;font-weight:600;color:#333;white-space:nowrap}.link-row .link-url{flex:1 1 100%;font-size:11px;color:var(--fg-2);word-break:break-all;user-select:all;-webkit-user-select:all}.link-row .copy-note{flex:1 1 100%;font-size:11px;color:var(--accent-dark);font-weight:600}.qr-box{max-height:52vh;height:auto;object-fit:contain;margin:6px auto 12px;border-radius:8px;box-shadow:0 0 0 1px #eee}.qr-box,.qr-download{display:block;width:100%;max-width:300px}.qr-download{margin:0 auto 10px;padding:11px;background:#eef4ff;color:#1d4ed8;border:none;border-radius:10px;font-size:13.5px;font-weight:700;text-align:center;text-decoration:none}.transfer-block{border:1px solid var(--hairline);text-align:left}.transfer-divider{font-size:10.5px;letter-spacing:.08em;color:var(--muted-2);text-align:center;font-weight:700;margin-bottom:10px}.transfer-bank{font-size:13.5px;font-weight:700}.transfer-logo{display:block;height:26px;width:auto;margin-bottom:2px}.transfer-payee{font-size:12.5px;color:var(--muted-2);margin-bottom:10px}.transfer-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid #f2f2f2}.transfer-label{font-size:11.5px;color:var(--muted-2)}.transfer-value{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.wa-btn{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}.wa-icon{width:17px;height:17px;flex:none}.pay-card{border-radius:12px;padding:14px 16px;margin-bottom:12px}.pay-card-success{display:flex;align-items:flex-start;gap:10px;text-align:left;background:var(--accent-soft);border:1px solid var(--accent-border)}.pay-check{flex:none;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}.pay-card-success .pay-card-title{font-size:15px;font-weight:700;color:var(--accent-text)}.pay-card-success .pay-card-sub{font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.4}.pay-card-amount{background:#f6f7f9;text-align:center}.pay-card-amount .amt-label{font-size:12px;color:var(--muted)}.pay-card-amount .amt{font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1.15}.pay-card-amount .amt-row{gap:2px}.amt-copy,.pay-card-amount .amt-row{display:flex;align-items:center;justify-content:center}.amt-copy{flex:none;width:40px;height:40px;background:none;border:none;padding:0;color:var(--muted-2);cursor:pointer}.amt-copy:active{color:var(--accent)}.copy-icon{width:17px;height:17px;display:block}.pay-card-amount .ref{font-size:12px;color:var(--muted-2);margin-top:2px}.pay-card-amount .discount-note{font-size:12.5px;font-weight:600;color:var(--accent-text);margin-top:2px}.pay-card-qr{border:1px solid var(--hairline);text-align:center}.pay-card-qr .qr-title{font-size:16px;font-weight:700}.pay-card-qr .qr-sub{font-size:12.5px;color:var(--muted);margin-bottom:4px}.pay-card-qr>:last-child{margin-bottom:0}.fine{font-size:11px;color:var(--muted-2);text-align:center;margin-bottom:14px;line-height:1.4}.board-header{text-align:center;margin-bottom:4px}.board-header h4{margin:0 0 4px;font-size:15.5px;font-weight:600;letter-spacing:-.01em}.board-stat{text-align:center;font-size:12.5px;color:var(--accent);font-weight:600;margin-bottom:4px}.board-state{text-align:center;font-size:11px;color:var(--muted-2);margin-bottom:10px}.board-back-link{display:block;text-align:center;margin-bottom:16px;font-size:12.5px;font-weight:600;color:var(--accent-dark);text-decoration:none}.board-back-link:hover{text-decoration:underline}.neighbour-row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid #f1f1f1}.avatar{width:32px;height:32px;border-radius:50%;background:#dcfce7;color:var(--accent-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0}.avatar,.neighbour-info .name{font-size:13px;font-weight:700}.neighbour-info .items{font-size:12px;color:var(--muted);margin-top:2px}.page-state{max-width:480px;margin:0 auto;padding:48px 20px;text-align:center;color:var(--muted);font-size:14px}.page-state .retry-btn{margin-top:14px;background:var(--accent);color:#fff;border:none;border-radius:980px;padding:11px 24px;font-size:14px;font-weight:600}