:root{--font-display: "Outfit", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body: "Inter", "Noto Sans JP", -apple-system, BlinkMacSystemFont, sans-serif;--bg-app: #F8F9FA;--bg-card: #FFFFFF;--bg-input: #F3F4F6;--text-main: #111827;--text-muted: #6B7280;--text-light: #9CA3AF;--primary: #3B82F6;--primary-hover: #2563EB;--accent: #10B981;--danger: #EF4444;--warning: #F59E0B;--card-dark: #12131C;--card-dark-gradient: linear-gradient(135deg, #1A1D29 0%, #0C0D14 100%);--radius-xl: 24px;--radius-lg: 18px;--radius-md: 12px;--radius-sm: 8px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .05), 0 2px 4px -1px rgba(0, 0, 0, .03);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .05), 0 4px 6px -2px rgba(0, 0, 0, .02);--shadow-card: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04)}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-body);background-color:#0f172a;color:var(--text-main);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}.app-container{display:flex;justify-content:center;align-items:center;width:100%;padding:20px}.phone-frame{width:390px;height:844px;background-color:var(--bg-app);border:10px solid #1E293B;border-radius:40px;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000080;display:flex;flex-direction:column}.screen-content{flex:1;overflow-y:auto;padding:24px 16px 160px;scrollbar-width:none}.screen-content::-webkit-scrollbar{display:none}.app-view{display:none;animation:fadeIn .3s ease-out}.app-view.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.app-header{padding:8px 4px 12px}.header-subtitle{font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.header-row{display:flex;justify-content:space-between;align-items:center;margin-top:2px}.header-title{font-family:var(--font-display);font-size:26px;font-weight:800;color:var(--text-main)}.dashboard-card{background:var(--card-dark-gradient);border-radius:28px;padding:22px 24px;color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow-card);margin-bottom:20px;cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s ease}.dashboard-card:active{transform:scale(.98)}.card-wave-bg{position:absolute;top:-20px;right:-20px;width:180px;height:180px;background:radial-gradient(circle,#3b82f626,#0000 70%);border-radius:50%;pointer-events:none}.card-wave-bg:after{content:"";position:absolute;bottom:-40px;left:-80px;width:150px;height:150px;background:radial-gradient(circle,#a855f71f,#0000 70%);border-radius:50%}.card-content{position:relative;z-index:2}.card-row{display:flex;justify-content:space-between;align-items:flex-start}.card-label{font-size:12px;font-weight:500;color:#fff9;display:flex;align-items:center;gap:4px}.info-trigger{display:inline-flex;width:14px;height:14px;background:#ffffff26;border-radius:50%;font-size:9px;justify-content:center;align-items:center;cursor:help}.card-icon-container{display:flex;gap:8px}.refresh-badge{background:#ffffff14;border:1px solid rgba(255,255,255,.1);padding:6px;border-radius:10px;display:flex;align-items:center;justify-content:center}.refresh-badge i{width:14px;height:14px;color:#fffc}.spin-icon{transition:transform .5s ease}.refresh-badge:active .spin-icon{transform:rotate(180deg)}.card-total{font-family:var(--font-display);font-size:38px;font-weight:800;margin-top:4px;margin-bottom:20px;letter-spacing:-.5px}.card-footer-row{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.1);padding-top:14px}.card-footer-item{display:flex;flex-direction:column}.card-footer-item.align-right{align-items:flex-end}.footer-label{font-size:10px;color:#ffffff73;text-transform:uppercase;margin-bottom:2px}.footer-val{font-family:var(--font-display);font-size:16px;font-weight:700}.card-bottom-text{text-align:center;font-size:9px;color:#ffffff59;margin-top:12px;font-weight:500}.filter-tab-container{display:flex;background-color:#e5e7eb;padding:4px;border-radius:14px;margin-bottom:16px}.filter-tab{flex:1;border:none;background:none;padding:8px 0;font-size:13px;font-weight:600;color:var(--text-muted);border-radius:10px;cursor:pointer;display:flex;justify-content:center;align-items:center;gap:6px;transition:background-color .2s,color .2s,box-shadow .2s}.filter-tab.active{background-color:var(--bg-card);color:var(--text-main);box-shadow:var(--shadow-sm)}.filter-tab .badge{font-size:10px;font-weight:700;opacity:.6}.sort-tags-container{display:flex;gap:8px;overflow-x:auto;padding:2px 4px 8px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.15) transparent;cursor:grab;-webkit-user-select:none;user-select:none}.sort-tags-container.dragging{cursor:grabbing}.sort-tags-container::-webkit-scrollbar{height:4px}.sort-tags-container::-webkit-scrollbar-track{background:transparent}.sort-tags-container::-webkit-scrollbar-thumb{background:#00000026;border-radius:4px}.sort-tags-container::-webkit-scrollbar-thumb:hover{background:#0000004d}.sort-tag{border:none;background-color:#ececf0;color:#4b5563;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer;transition:all .2s}.sort-tag.active{background-color:#212121;color:#fff}.section-title{font-size:11px;font-weight:700;color:var(--text-muted);margin:8px 4px 12px;text-transform:uppercase;letter-spacing:.5px}.subscription-list{display:flex;flex-direction:column;gap:12px}.sub-card{background-color:var(--bg-card);border-radius:var(--radius-md);padding:14px 16px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px;cursor:pointer;position:relative;transition:transform .15s,box-shadow .15s}.sub-card:active{transform:scale(.98)}.sub-card-pinned{border-left:4px solid var(--primary)}.sub-card-row{display:flex;align-items:center;justify-content:space-between}.sub-card-left{display:flex;align-items:center;gap:12px}.sub-logo{width:40px;height:40px;border-radius:10px;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;padding:6px;box-shadow:inset 0 1px 2px #0000000d}.sub-logo img{width:100%;height:100%;object-fit:contain}.sub-info{display:flex;flex-direction:column}.sub-name{font-size:15px;font-weight:700;color:var(--text-main)}.sub-tag{font-size:10px;font-weight:600;color:var(--text-light);margin-top:1px}.sub-card-right{display:flex;align-items:center;gap:8px}.sub-price{font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--text-main)}.sub-cycle-text{font-size:11px;color:var(--text-muted);font-weight:500}.chevron-icon{width:14px;height:14px;color:var(--text-light)}.pin-indicator{position:absolute;top:8px;right:8px;color:var(--primary);display:flex;align-items:center;opacity:.85}.pin-indicator i,.pin-indicator svg{width:11px;height:11px}.sub-progress-container{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}.progress-track{flex:1;height:3px;background-color:#e5e7eb;border-radius:2px;overflow:hidden}.progress-bar{height:100%;background-color:var(--primary);border-radius:2px;transition:width .3s ease}.days-remaining{font-size:11px;font-weight:700;color:var(--text-main);white-space:nowrap}.fab-btn{position:absolute;bottom:85px;right:20px;width:50px;height:50px;background-color:#12131c;color:#fff;border:none;border-radius:25px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 15px -3px #0000004d;cursor:pointer;z-index:15;transition:transform .2s,background-color .2s}.fab-btn:active{transform:scale(.92)}.fab-btn i{width:20px;height:20px;stroke-width:2.5}.bottom-nav{position:absolute;bottom:0;left:0;right:0;height:75px;background-color:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid rgba(0,0,0,.05);display:flex;justify-content:space-around;align-items:center;padding-bottom:16px;z-index:10}.nav-item{border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-light);cursor:pointer;flex:1;transition:color .2s}.nav-item.active{color:#12131c}.nav-icon{width:20px;height:20px;stroke-width:2;transition:transform .2s}.nav-item:active .nav-icon{transform:scale(1.1)}.nav-item span{font-size:10px;font-weight:700}.calendar-container{background-color:var(--bg-card);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-sm);margin-bottom:16px}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.calendar-header h3{font-size:15px;font-weight:700}.cal-btn{background:none;border:none;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;color:var(--text-main);transition:background-color .2s}.cal-btn:hover{background-color:var(--bg-input)}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:11px;font-weight:700;color:var(--text-light);margin-bottom:8px}.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);row-gap:6px}.cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;font-weight:600;border-radius:50%;cursor:pointer;position:relative;transition:all .2s}.cal-day:hover{background-color:var(--bg-input)}.cal-day.today{border:1px solid var(--text-main)}.cal-day.selected{background-color:#12131c!important;color:#fff!important}.cal-day.other-month{color:var(--text-light);opacity:.4}.cal-day .dot-indicator{width:4px;height:4px;background-color:var(--primary);border-radius:50%;position:absolute;bottom:4px}.analysis-card{background-color:var(--bg-card);border-radius:var(--radius-lg);padding:24px 16px;box-shadow:var(--shadow-sm);margin-bottom:16px;display:flex;justify-content:center}.chart-container{width:200px;height:200px;position:relative}.category-breakdown-list{display:flex;flex-direction:column;gap:10px}.category-item{background-color:var(--bg-card);border-radius:var(--radius-md);padding:12px 16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:space-between}.category-left{display:flex;align-items:center;gap:12px}.category-color-dot{width:12px;height:12px;border-radius:50%}.category-name{font-size:13px;font-weight:700}.category-right{display:flex;flex-direction:column;align-items:flex-end}.category-total-price{font-family:var(--font-display);font-size:13px;font-weight:700}.category-percentage{font-size:10px;color:var(--text-muted);font-weight:500}.diagnostics-summary{background:var(--card-dark-gradient);border-radius:var(--radius-lg);padding:24px;color:#fff;display:flex;align-items:center;gap:20px;margin-bottom:20px;box-shadow:var(--shadow-lg)}.diagnostics-score{width:70px;height:70px;border:4px solid var(--accent);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-num{font-family:var(--font-display);font-size:22px;font-weight:800}.score-label{font-size:8px;opacity:.8;font-weight:700}.diagnostics-summary-text{flex:1;font-size:12px;line-height:1.5;font-weight:500}.advice-card{background-color:var(--bg-card);border-radius:var(--radius-md);padding:16px;box-shadow:var(--shadow-sm);display:flex;gap:14px;margin-bottom:10px}.advice-card.warning-advice{border-left:4px solid var(--warning)}.advice-card.tip-advice{border-left:4px solid var(--primary)}.advice-icon-wrapper{color:var(--warning);display:flex;align-items:flex-start;padding-top:2px}.advice-card.tip-advice .advice-icon-wrapper{color:var(--primary)}.advice-icon-wrapper i{width:20px;height:20px}.advice-content{display:flex;flex-direction:column;gap:4px}.advice-title{font-size:13px;font-weight:700;color:var(--text-main)}.advice-desc{font-size:11px;color:var(--text-muted);line-height:1.4}.settings-group{margin-bottom:24px}.settings-group-title{font-size:11px;font-weight:700;color:var(--text-muted);margin-bottom:8px;text-transform:uppercase}.settings-item{background-color:var(--bg-card);border-radius:var(--radius-md);padding:14px 16px;box-shadow:var(--shadow-sm);display:flex;justify-content:space-between;align-items:center}.settings-label{font-size:13px;font-weight:600;color:var(--text-main)}.settings-input-wrapper{display:flex;align-items:center;gap:6px}.settings-input{width:70px;border:1px solid #E5E7EB;border-radius:6px;padding:6px 8px;font-size:13px;font-weight:600;text-align:right}.currency-unit{font-size:12px;color:var(--text-muted)}.settings-action-btn{width:100%;background-color:var(--bg-card);border:none;border-radius:var(--radius-md);padding:14px;font-size:13px;font-weight:600;color:var(--text-main);text-align:left;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-sm);margin-bottom:8px;cursor:pointer;transition:background-color .2s}.settings-action-btn:active{background-color:var(--bg-input)}.settings-action-btn i{width:16px;height:16px;color:var(--text-muted)}.settings-action-btn.danger,.settings-action-btn.danger i{color:var(--danger)}.settings-text-item{background-color:var(--bg-card);border-radius:var(--radius-md);padding:16px;box-shadow:var(--shadow-sm);font-size:12px;line-height:1.5}.text-muted{color:var(--text-muted);margin-top:4px}.modal-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20;display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.16,1,.3,1)}.modal-overlay.active{opacity:1;pointer-events:auto}.modal-card{background-color:var(--bg-card);width:100%;border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:24px 20px 40px;transform:translateY(100%);transition:transform .3s cubic-bezier(.16,1,.3,1);box-shadow:0 -10px 25px -5px #0000001a;max-height:85%;overflow-y:auto;scrollbar-width:none}.modal-card::-webkit-scrollbar{display:none}.modal-overlay.active .modal-card{transform:translateY(0)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{font-size:18px;font-weight:700;color:var(--text-main)}.close-btn{background:none;border:none;font-size:24px;font-weight:300;color:var(--text-light);cursor:pointer;line-height:1}.form-group{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}.form-row{display:flex;gap:12px}.width-50{flex:1}.form-group label{font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase}.form-group input,.form-group select{background-color:var(--bg-input);border:1px solid transparent;border-radius:var(--radius-sm);padding:10px 12px;font-size:14px;color:var(--text-main);outline:none;transition:all .2s}.form-group input:focus,.form-group select:focus{border-color:var(--primary);background-color:var(--bg-card);box-shadow:0 0 0 2px #3b82f61a}.logo-presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:4px}.preset-btn{width:44px;height:44px;border-radius:10px;border:2px solid transparent;background-color:var(--bg-input);display:flex;align-items:center;justify-content:center;padding:8px;cursor:pointer;font-size:10px;font-weight:700;color:var(--text-muted);transition:all .2s}.preset-btn img{width:100%;height:100%;object-fit:contain}.preset-btn.active{border-color:var(--primary);background-color:var(--bg-card);box-shadow:var(--shadow-sm)}.hidden{display:none!important}.form-actions{display:flex;gap:10px;margin-top:24px}.btn{flex:1;border:none;border-radius:var(--radius-md);padding:14px;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s}.btn-primary{background-color:#12131c;color:#fff}.btn-primary:active{background-color:#000}.btn-secondary{background-color:var(--bg-input);color:var(--text-main)}.btn-secondary:active{background-color:#e5e7eb}.btn-danger{background-color:#fee2e2;color:var(--danger)}.btn-danger:active{background-color:#fca5a5}.text-primary{color:var(--primary)!important}.detail-hero{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 0 24px;border-bottom:1px solid var(--bg-input)}.detail-logo-wrapper{width:68px;height:68px;border-radius:18px;background-color:var(--bg-input);display:flex;align-items:center;justify-content:center;padding:10px;box-shadow:var(--shadow-sm)}.detail-logo-wrapper img{width:100%;height:100%;object-fit:contain}.detail-hero h3{font-size:20px;font-weight:700}.detail-price-large{font-family:var(--font-display);font-size:24px;font-weight:800;color:var(--text-main)}.detail-info-list{padding:16px 0}.detail-info-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #F3F4F6}.detail-info-item:last-child{border-bottom:none}.info-label{font-size:13px;color:var(--text-muted);font-weight:500}.info-value{font-size:13px;font-weight:600;color:var(--text-main)}.info-value.highlight{color:var(--primary);font-weight:700}.detail-actions{display:flex;flex-direction:column;gap:10px;margin-top:10px}.detail-actions .btn{width:100%}.detail-actions i{width:16px;height:16px}.quick-presets-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;max-height:155px;overflow-y:auto;padding:8px;background-color:var(--bg-input);border-radius:var(--radius-md);border:1px solid #E5E7EB;margin-bottom:4px}.preset-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px;background-color:var(--bg-card);border-radius:var(--radius-sm);border:1.5px solid transparent;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);min-width:0}.preset-item:hover,.preset-item.active{border-color:var(--primary);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.preset-item img{width:24px;height:24px;object-fit:contain}.preset-item span{font-size:8px;font-weight:700;color:var(--text-main);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}@media (max-width: 480px){.phone-frame{width:100vw;height:100vh;border:none;border-radius:0}body{background-color:var(--bg-app)}.app-container{padding:0}}@media (max-height: 600px){#presets-form-group{display:none}.modal-card{padding:16px 16px 280px;max-height:95%}.modal-header{margin-bottom:12px}.form-group{margin-bottom:10px;gap:4px}.form-group label{font-size:10px}.form-group input,.form-group select{padding:8px 10px;font-size:13px}.form-row{gap:8px}.form-actions{margin-top:16px}.btn{padding:10px;font-size:13px}}