:root{--bg: #f4f5f9;--surface: #ffffff;--surface-tint: #f8fafc;--border: #e7eaf0;--border-strong: #cfd4de;--text: #0f172a;--text-muted: #566076;--text-faint: #94a3b8;--primary: #1677ff;--primary-ink: #ffffff;--primary-tint: #eaf2ff;--accent: #10b981;--warn: #d97706;--danger: #c0392b;--radius-sm: 8px;--radius: 12px;--radius-lg: 16px;--shadow-xs: 0 1px 2px rgba(15, 23, 42, .05);--shadow-sm: 0 1px 3px rgba(15, 23, 42, .06), 0 2px 6px -2px rgba(15, 23, 42, .08);--shadow-md: 0 4px 12px -4px rgba(15, 23, 42, .12), 0 8px 24px -12px rgba(15, 23, 42, .18);--shadow-ring: 0 0 0 3px rgba(22, 119, 255, .18)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{max-width:460px;margin:0 auto;min-height:100vh;background:var(--bg);padding-bottom:96px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:saturate(1.2) blur(8px);backdrop-filter:saturate(1.2) blur(8px)}.topbar-actions{display:flex;gap:6px;align-items:center}.brand{background:none;border:none;font-size:17px;font-weight:800;letter-spacing:-.01em;cursor:pointer;padding:0;display:flex;align-items:center;gap:8px;color:var(--text)}.brand-mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#1677ff,#4e9bff);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;box-shadow:var(--shadow-xs)}.topbar-btn{background:transparent;border:1px solid transparent;color:var(--text-muted);font-size:13px;font-weight:500;padding:6px 10px;border-radius:999px;cursor:pointer;position:relative}.topbar-btn:hover{background:var(--surface-tint);color:var(--text)}.topbar-btn:focus-visible{outline:none;box-shadow:var(--shadow-ring)}.cart-pill{background:var(--primary-tint);color:var(--primary);padding:6px 12px;border-radius:999px;font-weight:600}.cart-pill-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--primary);color:#fff;font-size:11px;font-weight:700;margin-left:6px}.dev-chip{background:#fef3c7;color:#92400e;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.greeting{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 20px;background:var(--surface);border-bottom:1px solid var(--border);font-size:13px;color:var(--text-muted)}.badge{background:#fff6e3;color:#92561a;border:1px solid #f3dcae;border-radius:999px;padding:2px 10px;font-size:11px;font-weight:500}.screen{padding:16px 20px 24px;display:flex;flex-direction:column;gap:14px}.screen-pad{padding:0 20px}h1{font-size:22px;margin:4px 0 0;letter-spacing:-.015em;display:flex;align-items:center;gap:10px;flex-wrap:wrap}h2{font-size:14px;margin:12px 0 2px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.muted{color:var(--text-muted);font-size:13px}.error{color:var(--danger);font-size:13px}.ref{font-size:11px;color:var(--text-faint);word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.link{background:none;border:none;color:var(--primary);font-size:14px;cursor:pointer;padding:0;text-align:left}.link:hover{text-decoration:underline}.btn{padding:14px 16px;border-radius:12px;border:none;font-size:15px;font-weight:600;cursor:pointer;transition:transform .08s ease,box-shadow .12s ease,background .12s ease;box-shadow:var(--shadow-xs)}.btn:focus-visible{outline:none;box-shadow:var(--shadow-ring)}.btn:active{transform:translateY(1px)}.btn-sm{padding:8px 14px;font-size:13px}.btn-primary{background:var(--primary);color:var(--primary-ink);box-shadow:0 6px 14px -6px #1677ff99}.btn-primary:hover{background:#0f66e6}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:none}.btn-secondary:hover{background:var(--surface-tint);border-color:var(--border-strong)}.btn-ghost{background:transparent;color:var(--text-muted);box-shadow:none}.btn-ghost:hover{background:var(--surface-tint);color:var(--text)}.btn:disabled{opacity:.5;cursor:default;transform:none}.hero{background:linear-gradient(135deg,#1a3a6e,#1677ff);color:#fff;border-radius:var(--radius-lg);padding:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:var(--shadow-md)}.hero-text{display:flex;flex-direction:column;gap:4px}.hero-eyebrow{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.85}.hero-title{font-size:20px;font-weight:800;letter-spacing:-.01em}.hero-sub{font-size:13px;opacity:.88;max-width:240px}.hero-emoji{font-size:44px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.2))}.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.product-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-xs);transition:box-shadow .12s ease,border-color .12s ease,transform .08s ease}.product-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm)}.product-card-tile{aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;font-size:60px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.9),var(--tile-color, #eaf2ff))}.product-card-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px}.product-card-name{font-size:14px;font-weight:600;line-height:1.25;min-height:2.4em}.product-card-price{font-size:15px;font-weight:800;letter-spacing:-.01em}.product-card-cta{margin-top:4px;display:flex;align-items:center;justify-content:center}.product-card-cta .btn{width:100%;padding:8px 12px;font-size:13px}.product{display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.product-emoji{font-size:28px}.product-body{flex:1;min-width:0}.product-name{font-weight:600}.product-price{margin-top:2px;font-weight:700}.stepper{display:flex;align-items:center;gap:10px;background:var(--surface-tint);border-radius:999px;padding:2px}.stepper button{width:28px;height:28px;border-radius:999px;border:none;background:var(--surface);color:var(--text);font-size:16px;cursor:pointer;box-shadow:var(--shadow-xs)}.stepper button:hover{background:var(--primary-tint);color:var(--primary)}.stepper span{min-width:18px;text-align:center;font-weight:600}.cart-cta-floating{position:fixed;left:50%;transform:translate(-50%);bottom:16px;width:calc(min(460px,100%) - 32px);background:var(--text);color:#fff;padding:12px 16px;border-radius:999px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:var(--shadow-md);cursor:pointer;border:none;z-index:30;font-size:14px;font-weight:600;transition:transform .12s ease}.cart-cta-floating:hover{transform:translate(-50%) translateY(-1px)}.cart-cta-left{display:flex;align-items:center;gap:10px}.cart-cta-count{background:#ffffff24;border-radius:999px;padding:2px 10px;font-size:12px}.section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:10px}.summary{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}.summary-line{display:flex;justify-content:space-between;gap:12px;font-size:14px}.summary-total{font-weight:700;font-size:16px;border-top:1px solid var(--border);padding-top:10px}.methods{display:flex;flex-direction:column;gap:10px}.method-card{display:flex;align-items:center;gap:14px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;text-align:left;box-shadow:var(--shadow-xs);transition:border-color .12s ease,box-shadow .12s ease,transform .08s ease}.method-card:hover:not(:disabled){border-color:var(--primary);box-shadow:var(--shadow-sm)}.method-card:active:not(:disabled){transform:translateY(1px)}.method-card:disabled{opacity:.55;cursor:not-allowed}.method-card:focus-visible{outline:none;box-shadow:var(--shadow-ring)}.method-icon{width:44px;height:44px;border-radius:12px;background:var(--primary-tint);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}.method-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.method-title{font-weight:700;font-size:15px}.method-sub{font-size:12px;color:var(--text-muted)}.method-tag{font-size:10px;font-weight:700;color:var(--primary);background:var(--primary-tint);padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.method-chevron{color:var(--text-faint);font-size:20px}.account,.month{padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);text-align:left;cursor:pointer;font-size:14px;transition:border-color .12s ease,background .12s ease}.account:hover,.month:hover{border-color:var(--primary);background:var(--primary-tint)}.months{display:grid;grid-template-columns:1fr 1fr;gap:8px}.order-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:left;cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}.order-row:hover{border-color:var(--border-strong);box-shadow:var(--shadow-sm)}.order-row-main{display:flex;flex-direction:column;gap:4px;min-width:0}.order-row-total{font-weight:700;font-size:16px}.order-row-meta{font-size:12px;color:var(--text-muted);display:flex;gap:6px;flex-wrap:wrap}.order-row-emojis{font-size:15px}.status-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-xs)}.status-hero-amount{font-size:28px;font-weight:800;letter-spacing:-.015em}.status-hero-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.status-hero-meta{font-size:12px;color:var(--text-muted)}.status-hero-note{font-size:13px;color:var(--text-muted)}.chip{border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;background:#eef1f5;color:#374151;white-space:nowrap}.chip-lg{padding:5px 12px;font-size:13px}.chip-paid{background:#e7f8ed;color:#17663a}.chip-reserved{background:#eaf1ff;color:#1d4ed8}.chip-awaiting_payment,.chip-otp_pending,.chip-refunding{background:#fff5e6;color:#8a5a00}.chip-cancelled,.chip-failed,.chip-expired{background:#fdeaea;color:#9b1c1c}.chip-refunded,.chip-archived{background:#f3f0ff;color:#5b21b6}.plan{border:1px solid #d7e7ff;background:#eef5ff;border-radius:var(--radius);padding:12px}.timeline{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--text-muted)}.timeline li strong{color:var(--text);font-weight:600}.disclosure{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.disclosure summary{padding:10px 14px;cursor:pointer;font-size:13px;color:var(--text-muted);list-style:none;display:flex;justify-content:space-between;align-items:center}.disclosure summary::-webkit-details-marker{display:none}.disclosure[open] summary{border-bottom:1px solid var(--border)}.disclosure-body{padding:12px 14px;font-size:12px;color:var(--text-muted);display:flex;flex-direction:column;gap:6px}input{padding:12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:17px;letter-spacing:2px;text-align:center;background:var(--surface);color:var(--text)}input:focus{outline:none;border-color:var(--primary);box-shadow:var(--shadow-ring)}input.input-text{font-size:15px;letter-spacing:normal;text-align:left;width:100%}.field{display:flex;flex-direction:column;gap:4px}.field-label{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.tasdid-card{background:linear-gradient(135deg,#065f46,#10b981);color:#fff;border-radius:var(--radius-lg);padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-md)}.tasdid-card .muted{color:#ffffffd1}.tasdid-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}.tasdid-card-eyebrow{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.tasdid-pay-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:32px;font-weight:700;letter-spacing:.08em;background:#ffffff24;border-radius:var(--radius);padding:14px 16px;text-align:center;-webkit-user-select:all;user-select:all}.tasdid-card-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:13px}.log-controls{display:flex;align-items:center;gap:16px}.checkbox{width:auto;padding:0;letter-spacing:normal;vertical-align:middle}.attachments{display:flex;flex-direction:column;gap:10px}.dropzone{border:2px dashed #c7d2fe;border-radius:var(--radius);padding:20px;text-align:center;cursor:pointer;background:#f8faff;transition:background .15s,border-color .15s}.dropzone:hover,.dropzone-active{background:#eef2ff;border-color:#818cf8}.dropzone p{margin:4px 0}.attachment-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.attachment{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface)}.attachment-main{display:flex;flex-direction:column;gap:2px;min-width:0}.attachment-main a{color:var(--text);text-decoration:none;word-break:break-all}.attachment-main a:hover{text-decoration:underline}.superqi-test{border:1px solid var(--border);border-radius:var(--radius);padding:14px;background:#fffcf4;display:flex;flex-direction:column;gap:10px}.superqi-test h2{margin:0;font-size:14px;color:#92561a}.superqi-test-buttons{display:flex;flex-wrap:wrap;gap:8px}.superqi-test-outcome{border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px;background:var(--surface);font-size:13px}.superqi-test-pending{border-color:#c7d2fe;background:#f0f4ff}.superqi-test-ok{border-color:#bbf7d0;background:#f0fdf4}.superqi-test-err{border-color:#fecaca;background:#fef2f2}.superqi-test-json{margin:8px 0 0;padding:8px;border-radius:6px;background:#0f172a;color:#e2e8f0;font-size:12px;white-space:pre-wrap;word-break:break-all;max-height:220px;overflow:auto}.log{border-left:3px solid var(--border-strong);background:var(--surface);border-radius:6px;padding:8px 10px;font-size:12px}.log-error{border-left-color:#dc2626;background:#fef4f4}.log-warn{border-left-color:#d97706;background:#fffaf2}.log-head{display:flex;justify-content:space-between;gap:8px}.log-scope{font-weight:700;text-transform:uppercase;font-size:10px;letter-spacing:.5px;color:var(--text-muted)}.log-msg{margin-top:2px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-word}.log-detail{margin:6px 0 0;padding:6px;background:var(--surface-tint);border:1px solid var(--border);border-radius:4px;font-size:11px;white-space:pre-wrap;word-break:break-word;max-height:220px;overflow:auto}.empty{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 20px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}.empty-emoji{font-size:42px}.empty-title{font-weight:700;font-size:16px}.empty-sub{color:var(--text-muted);font-size:13px;max-width:260px}
