*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:#f5f6f8;color:#1a1a1a}.app{max-width:460px;margin:0 auto;min-height:100vh;background:#fff}.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #e5e7eb}.topbar-actions{display:flex;gap:16px}.brand{background:none;border:none;font-size:17px;font-weight:700;cursor:pointer;padding:0}.greeting{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 20px;background:#f8fafc;border-bottom:1px solid #eef1f5;font-size:14px}.badge{background:#fff5e6;color:#8a5a00;border:1px solid #f0d9b0;border-radius:999px;padding:2px 10px;font-size:12px}.screen{padding:20px;display:flex;flex-direction:column;gap:14px}.screen-pad{padding:0 20px}h1{font-size:20px;margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}h2{font-size:15px;margin:8px 0 0}.product{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid #e5e7eb;border-radius:12px}.product-emoji{font-size:28px}.product-body{flex:1}.product-name{font-weight:600}.product-price{margin-top:2px;font-weight:700}.stepper{display:flex;align-items:center;gap:10px}.stepper button{width:30px;height:30px;border-radius:8px;border:1px solid #d1d5db;background:#fff;font-size:17px;cursor:pointer}.btn{padding:14px;border-radius:10px;border:none;font-size:16px;font-weight:600;cursor:pointer}.btn-sm{padding:8px 14px;font-size:14px}.btn-primary{background:#1677ff;color:#fff}.btn-secondary{background:#eef1f5;color:#1a1a1a}.btn:disabled{opacity:.5;cursor:default}.link{background:none;border:none;color:#1677ff;font-size:14px;cursor:pointer;padding:0;text-align:left}.summary{border:1px solid #e5e7eb;border-radius:12px;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 #e5e7eb;padding-top:8px}.account,.month{padding:12px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;text-align:left;cursor:pointer;font-size:14px}.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;border:1px solid #e5e7eb;border-radius:12px;background:#fff;text-align:left;cursor:pointer}.chip{border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;background:#eef1f5;color:#374151;white-space:nowrap}.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:10px;padding:12px}.timeline{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:13px}.muted{color:#6b7280;font-size:13px}.error{color:#c0392b}.ref{font-size:11px;color:#9ca3af;word-break:break-all}input{padding:12px;border:1px solid #d1d5db;border-radius:10px;font-size:17px;letter-spacing:2px;text-align:center}.log-controls{display:flex;align-items:center;gap:16px}.checkbox{width:auto;padding:0;letter-spacing:normal;vertical-align:middle}.log{border-left:3px solid #d1d5db;background:#fafafa;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:#6b7280}.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:#fff;border:1px solid #eceff3;border-radius:4px;font-size:11px;white-space:pre-wrap;word-break:break-word;max-height:220px;overflow:auto}
