*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}:root{--primary: #4F46E5;--primary-dark: #4338CA;--success: #10B981;--error: #EF4444;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-500: #6B7280;--gray-700: #374151;--gray-900: #111827}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--gray-50);color:var(--gray-900);min-height:100vh;min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-y:contain;touch-action:manipulation}.app{max-width:480px;margin:0 auto;padding:16px 16px 100px}.header{text-align:center;margin-bottom:24px}.header h1{font-size:24px;font-weight:700;color:var(--primary);margin-bottom:4px}.header p{font-size:14px;color:var(--gray-500)}.camera-section{margin-bottom:24px}.camera-button{width:100%;padding:20px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border:none;border-radius:16px;font-size:18px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 14px #4f46e566}.camera-button:active{transform:scale(.98)}.camera-button:disabled{opacity:.7;cursor:not-allowed}.camera-input{display:none}.loading{text-align:center;padding:40px}.spinner{width:48px;height:48px;border:4px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.result-card{background:#fff;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px #0000001a}.result-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.store-name{font-size:18px;font-weight:600}.category-badge{font-size:12px;padding:4px 10px;background:var(--gray-100);border-radius:20px;color:var(--gray-700)}.result-info{display:flex;gap:16px;margin-bottom:16px;font-size:14px;color:var(--gray-500)}.total-amount{font-size:28px;font-weight:700;color:var(--primary);margin-bottom:16px}.items-list{border-top:1px solid var(--gray-100);padding-top:16px}.items-list h4{font-size:14px;color:var(--gray-500);margin-bottom:8px}.item-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px;border-bottom:1px solid var(--gray-50)}.summary-section{background:#fff;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px #0000001a}.summary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.summary-header h2{font-size:16px;font-weight:600}.month-selector{display:flex;gap:8px}.month-btn{min-width:44px;min-height:44px;padding:8px 14px;border:1px solid var(--gray-200);background:#fff;border-radius:8px;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background-color .2s,transform .1s}.month-btn:hover{background:var(--gray-50)}.month-btn:active{transform:scale(.95);background:var(--gray-100)}.summary-total{text-align:center;padding:20px;background:var(--gray-50);border-radius:12px;margin-bottom:16px}.summary-total .amount{font-size:32px;font-weight:700;color:var(--gray-900)}.summary-total .label{font-size:14px;color:var(--gray-500)}.category-bar{margin-bottom:12px}.category-bar-header{display:flex;justify-content:space-between;margin-bottom:4px;font-size:14px}.category-bar-track{height:8px;background:var(--gray-100);border-radius:4px;overflow:hidden}.category-bar-fill{height:100%;background:var(--primary);border-radius:4px;transition:width .3s ease}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-header h2{font-size:20px;font-weight:600;color:var(--gray-900);margin:0}.refresh-btn{display:flex;align-items:center;gap:6px;padding:10px 16px;min-height:44px;background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-200);border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s,transform .1s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.refresh-btn:hover{background:var(--gray-200)}.refresh-btn:active{transform:scale(.98)}.refresh-btn svg{flex-shrink:0}.month-selector-row{display:flex;justify-content:center;align-items:center;gap:16px;margin-bottom:20px;font-size:18px;font-weight:600}.tab-nav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--gray-200);display:flex;justify-content:center;padding:8px 16px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.tab-btn{flex:1;max-width:120px;min-height:56px;padding:8px;border:none;background:transparent;font-size:12px;color:var(--gray-500);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:color .2s,transform .1s}.tab-btn:active{transform:scale(.95)}.tab-btn.active{color:var(--primary)}.tab-btn svg{width:24px;height:24px}.error-message{background:#fef2f2;color:var(--error);padding:16px;border-radius:12px;margin-bottom:16px;text-align:center}.empty-state{text-align:center;padding:40px;color:var(--gray-500)}.empty-state svg{width:64px;height:64px;margin-bottom:16px;opacity:.5}.settings-section{padding:16px 0}.settings-section h2{font-size:20px;font-weight:600;margin-bottom:20px;color:var(--gray-900)}.settings-card{background:#fff;border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px #0000001a}.settings-card h3{font-size:16px;font-weight:600;margin-bottom:12px;color:var(--gray-900)}.settings-input{width:100%;padding:14px 16px;border:1px solid var(--gray-200);border-radius:8px;font-size:16px;margin-bottom:12px;transition:border-color .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.settings-input:focus{outline:none;border-color:var(--primary)}@supports (-webkit-touch-callout: none){.settings-input{font-size:16px}}.settings-save-btn{width:100%;min-height:48px;padding:14px 16px;background:var(--primary);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .2s,transform .1s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.settings-save-btn:hover{background:var(--primary-dark)}.settings-save-btn:active{transform:scale(.98)}.settings-save-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.settings-btn-group{display:flex;gap:10px}.settings-btn-group .settings-save-btn{flex:1}.settings-clear-btn{min-height:48px;padding:14px 16px;background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-300);border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .2s,transform .1s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.settings-clear-btn:hover{background:var(--gray-200)}.settings-clear-btn:active{transform:scale(.98)}.settings-description{font-size:13px;color:var(--gray-500);margin-bottom:16px;line-height:1.5}.settings-status{font-size:13px;padding:10px 12px;border-radius:8px;margin-top:12px}.settings-status.success{background:#ecfdf5;color:var(--success)}.settings-status.error{background:#fef2f2;color:var(--error)}.user-id-display{background:var(--gray-50);padding:12px 16px;border-radius:8px;font-size:13px;color:var(--gray-700);word-break:break-all}.api-key-alert{background:#fef3c7;border:1px solid #F59E0B;color:#92400e;padding:16px;border-radius:12px;margin-bottom:16px;text-align:center;font-size:14px}.api-key-alert a{color:var(--primary);text-decoration:underline}@media(max-width:360px){.app{padding:12px 12px 90px}.header h1{font-size:20px}.camera-button{padding:16px;font-size:16px}.total-amount{font-size:24px}.summary-total .amount{font-size:28px}.result-header{flex-direction:column;gap:8px}.month-selector{gap:4px}.month-selector span{font-size:14px}}@media(max-height:500px)and (orientation:landscape){.app{padding-bottom:80px}.tab-nav{padding:4px 16px}.tab-btn{min-height:44px;gap:2px}.tab-btn svg{width:20px;height:20px}}@media(display-mode:standalone){.app{padding-top:max(16px,env(safe-area-inset-top))}}