.tab-bar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;box-sizing:border-box;height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);background:#fff;border-top:1px solid var(--border-oat);z-index:100}.tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;height:100%;text-decoration:none;color:var(--text-silver);transition:color .2s;-webkit-tap-highlight-color:transparent}.tab-item:active{background:var(--border-oat-light)}.tab-item.active{color:var(--text-black)}.tab-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-bottom:2px}.tab-icon-svg{width:22px;height:22px;flex-shrink:0;opacity:.92}.tab-item.active .tab-icon-svg{opacity:1}.tab-label{font-size:11px;font-family:Space Mono,monospace}@media (min-width: 768px){.tab-bar{max-width:768px;left:50%;transform:translate(-50%)}}.upload-zone{background:#fff;border:2px dashed var(--border-oat);border-radius:var(--radius-card);padding:32px 16px;text-align:center;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-clay)}.upload-zone:active{background:var(--border-oat-light)}.upload-zone.drag-active{border-color:var(--swatch-matcha);background:#078a520d}.upload-zone.disabled{opacity:.5;cursor:not-allowed}.upload-content{display:flex;flex-direction:column;align-items:center;gap:8px}.upload-icon{font-size:48px}.upload-text{font-size:16px;color:var(--text-black)}.upload-hint{font-size:12px;color:var(--text-silver)}.home-page{display:flex;flex-direction:column;gap:20px}.page-header{text-align:center;padding:20px 0}.page-header h1{font-size:24px;margin-bottom:8px}.subtitle{font-size:14px;color:var(--text-silver)}.upload-progress{display:flex;flex-direction:column;gap:8px}.progress-bar{height:8px;background:var(--border-oat);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--swatch-matcha);transition:width .3s}.progress-text{font-size:13px;color:var(--text-silver);text-align:center}.uploaded-info{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);font-size:14px}.btn-clear{background:none;border:none;color:var(--swatch-pomegranate);font-size:14px;cursor:pointer;padding:4px 8px}.btn-clear:active{opacity:.7}.action-buttons{display:flex;flex-direction:column;gap:12px}.btn-primary{width:100%;height:50px;font-size:16px;background:var(--text-black);color:#fff}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-primary:disabled:hover{transform:none;box-shadow:none;background:var(--text-black);color:#fff}.quick-actions{display:flex;justify-content:center}.quick-actions .btn{width:100%;border:1px solid var(--border-oat)}.review-section{display:flex;flex-direction:column;gap:16px}.review-title{font-size:18px;margin:0}.review-bill-list{display:flex;flex-direction:column;gap:12px}.review-bill-card{display:flex;flex-direction:column;gap:12px;padding:14px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn)}.review-bill-fields{display:flex;flex-direction:column;gap:10px}.review-field{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--text-silver);min-width:0}.review-field .input{width:100%;max-width:100%;min-width:0}.review-field-remark .input{width:100%}.btn-remove-row{align-self:flex-end;background:none;border:none;color:var(--swatch-pomegranate);font-size:14px;cursor:pointer;padding:4px 8px}.btn-remove-row:active{opacity:.7}.review-actions{display:flex;gap:12px}.review-actions .btn{flex:1;height:48px}.btn-secondary{width:100%;height:50px;font-size:16px;border:1px solid var(--border-oat);background:#fff;color:var(--text-black)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.bill-card-container{position:relative;overflow:hidden;border-radius:12px;margin-bottom:12px}.bill-card-actions{position:absolute;top:0;right:0;height:100%;display:flex;width:140px}.action-btn{flex:1;border:none;color:#fff;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center}.action-btn.edit{background-color:var(--swatch-lemon)}.action-btn.delete{background-color:var(--swatch-pomegranate)}.bill-card{display:flex;justify-content:space-between;align-items:flex-start;background:#fff;border:1px solid var(--border-oat);border-radius:12px;padding:16px;cursor:pointer;transition:transform .2s ease-out;box-shadow:var(--shadow-clay);position:relative;z-index:1}.bill-info{display:flex;flex-direction:column;gap:6px;flex:1}.category-tag{display:inline-block;padding:4px 10px;border-radius:4px;font-size:12px;width:fit-content}.bill-date{font-size:13px;color:var(--text-silver)}.bill-remark{font-size:13px;color:var(--text-black);margin:0}.bill-amount{font-size:18px;font-weight:500;font-family:Space Mono,monospace}.bill-amount.expense{color:var(--text-black)}.bill-amount.income{color:var(--swatch-matcha)}.bill-list-page{display:flex;flex-direction:column;gap:20px}.calendar-header{display:flex;justify-content:space-between;align-items:center;padding:10px 0}.calendar-header button{background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--text-black);cursor:pointer;box-shadow:var(--shadow-clay);transition:transform .2s}.calendar-header button:active{transform:scale(.95)}.calendar-header h2{font-size:18px;font-weight:700;color:var(--text-black)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-card);box-shadow:var(--shadow-clay);overflow:hidden}.weekday{text-align:center;padding:12px 0;font-size:12px;color:var(--text-silver);border-bottom:1px solid var(--border-oat-light);font-weight:700}.calendar-cell{min-height:60px;padding:6px;border-right:1px solid var(--border-oat-light);border-bottom:1px solid var(--border-oat-light);cursor:pointer;position:relative;display:flex;flex-direction:column;justify-content:space-between;background:#fff;transition:background-color .2s}.calendar-cell:nth-child(7n){border-right:none}.calendar-cell.other-month{color:var(--text-silver);background-color:var(--bg-cream)}.calendar-cell.selected{background-color:var(--border-oat-light)}.calendar-cell.today .date-num{background-color:var(--text-black);color:#fff;border-radius:50%;font-weight:700}.date-num{font-size:13px;margin-bottom:4px;width:22px;height:22px;display:flex;align-items:center;justify-content:center}.date-total{font-size:10px;text-align:right;word-break:break-all;font-weight:700}.date-total.expense{color:var(--text-black)}.date-total.income{color:var(--swatch-matcha)}.selected-date-details{background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-card);padding:16px;box-shadow:var(--shadow-clay)}.details-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px dashed var(--border-oat);font-weight:700;color:var(--text-black)}.details-total{color:var(--text-black)}.empty-state,.loading{text-align:center;padding:32px 0;color:var(--text-silver);font-size:14px}.bills-list{display:flex;flex-direction:column;gap:12px}.add-page{display:flex;flex-direction:column;gap:20px}.add-page .page-header{display:flex;align-items:center;gap:12px;padding:16px 0}.btn-back{background:none;border:none;font-size:14px;color:var(--text-silver);cursor:pointer;padding:4px 8px}.btn-back:active{color:var(--text-black)}.add-page .page-header h1{font-size:20px;margin:0}.bill-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:13px;color:var(--text-silver)}.amount-input{display:flex;flex-direction:column;gap:8px}.amount-type-toggle{display:flex;gap:8px}.type-btn{flex:1;height:40px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);font-size:14px;cursor:pointer;transition:all .2s}.type-btn.active.expense{background:var(--text-black);color:#fff;border-color:var(--text-black)}.type-btn.active.income{background:var(--swatch-matcha);color:#fff;border-color:var(--swatch-matcha)}.amount-field{font-size:24px;text-align:center;height:56px}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.category-option{height:44px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);font-size:14px;cursor:pointer;transition:all .2s}.category-option:active{transform:scale(.98)}.category-option.selected{background:var(--text-black);color:#fff;border-color:var(--text-black)}.form-actions{display:flex;gap:12px;margin-top:20px}.btn-cancel{flex:1;border:1px solid var(--border-oat)}.btn-submit{flex:2;background:var(--text-black);color:#fff}.btn-submit:disabled{opacity:.5;cursor:not-allowed}.btn-submit:disabled:hover{transform:none;box-shadow:none;background:var(--text-black);color:#fff}.statistics-page{display:flex;flex-direction:column;gap:20px}.statistics-page .page-header{padding:20px 0}.statistics-page .page-header h1{font-size:24px;margin:0}.month-selector{display:flex;justify-content:space-between;align-items:center;padding:12px 0}.btn-nav{width:44px;height:44px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}.btn-nav:active{background:var(--border-oat-light)}.current-month{font-size:18px;font-weight:500}.loading,.empty-state{text-align:center;padding:40px;color:var(--text-silver)}.stats-cards{display:flex;flex-direction:column;gap:12px}.stat-card{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-card);padding:20px;box-shadow:var(--shadow-clay)}.stat-label{font-size:14px;color:var(--text-silver)}.stat-value{font-size:24px;font-family:Space Mono,monospace;font-weight:500}.stat-card.income .stat-value{color:var(--swatch-matcha)}.stat-card.expense .stat-value{color:var(--text-black)}.stat-card.balance.positive .stat-value{color:var(--swatch-matcha)}.stat-card.balance.negative .stat-value{color:var(--swatch-pomegranate)}.stats-content,.stats-details{display:flex;flex-direction:column;gap:24px}.category-ranking,.bill-ranking{background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-card);padding:20px;box-shadow:var(--shadow-clay)}.category-ranking h3,.bill-ranking h3{margin:0 0 16px;font-size:16px;color:var(--text-black);font-weight:600}.ranking-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}.ranking-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:var(--bg-oat);border-radius:8px;cursor:pointer;transition:all .2s ease}.ranking-item:active{background:var(--border-oat-light)}.category-ranking .ranking-item.active{background:var(--text-black);color:#fff}.category-ranking .ranking-item.active .category-amount{color:#fff}.category-name{font-size:15px;font-weight:500}.category-amount{font-family:Space Mono,monospace;font-weight:500;color:var(--text-black)}.bill-info{display:flex;flex-direction:column;gap:4px}.bill-category{font-size:15px;font-weight:500;color:var(--text-black)}.bill-date{font-size:12px;color:var(--text-silver)}.bill-remark{font-size:13px;color:var(--text-silver)}.bill-amount{font-family:Space Mono,monospace;font-weight:500;color:var(--text-black)}.empty-item{text-align:center;padding:20px;color:var(--text-silver);font-size:14px}.role-select-page{min-height:calc(100vh - 32px);display:flex;flex-direction:column;gap:14px;justify-content:center}.role-header{text-align:center}.role-header h1{font-size:24px}.role-name-input{height:48px;font-size:16px}.role-error{color:var(--swatch-pomegranate);font-size:13px;text-align:center}.role-start-btn{width:100%;height:50px;margin-top:8px;background:var(--text-black);color:#fff}.role-start-btn:disabled{opacity:.35;cursor:not-allowed}html,body,#root{min-height:100%}:root{--bg-cream: #faf9f7;--border-oat: #dad4c8;--border-oat-light: #eee9df;--text-black: #000000;--text-silver: #9f9b93;--swatch-matcha: #078a52;--swatch-matcha-light: #84e7a5;--swatch-slushie: #3bd3fd;--swatch-lemon: #fbbd41;--swatch-ube: #43089f;--swatch-pomegranate: #fc7981;--shadow-clay: rgba(0,0,0,.1) 0px 1px 1px, rgba(0,0,0,.04) 0px -1px 1px inset;--shadow-hard: rgb(0,0,0) -7px 7px;--radius-card: 16px;--radius-btn: 8px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Space Mono,monospace;background:var(--bg-cream);color:var(--text-black);min-height:100vh;min-height:100dvh;-webkit-font-smoothing:antialiased}.app{min-height:100vh;min-height:100dvh;padding-bottom:calc(72px + env(safe-area-inset-bottom))}.main-content{width:100%;max-width:768px;margin:0 auto;padding:16px}@media (min-width: 768px){.main-content{padding:24px}}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;font-family:Space Mono,monospace;font-size:14px;background:transparent;color:var(--text-black);border:none;border-radius:var(--radius-btn);cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.98)}@media (hover: hover) and (pointer: fine){.btn:hover{background:var(--text-black);color:#fff}}.card{background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-card);box-shadow:var(--shadow-clay);padding:16px}.input{box-sizing:border-box;width:100%;max-width:100%;height:44px;padding:10px 12px;font-family:Space Mono,monospace;font-size:14px;background:#fff;border:1px solid var(--border-oat);border-radius:var(--radius-btn);outline:none;transition:border-color .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left}.input:focus{border-color:var(--text-black)}.category-matcha{background:var(--swatch-matcha);color:#fff}.category-slushie{background:var(--swatch-slushie);color:var(--text-black)}.category-lemon{background:var(--swatch-lemon);color:var(--text-black)}.category-ube{background:var(--swatch-ube);color:#fff}.category-pomegranate{background:var(--swatch-pomegranate);color:#fff}.category-default{background:var(--border-oat);color:var(--text-black)}