.subscription-card{border-radius:16px;padding:20px;margin-bottom:12px;cursor:pointer;transition:transform .2s,opacity .2s}.subscription-card:active{transform:scale(.98);opacity:.9}.card-content{display:flex;align-items:center;justify-content:space-between}.card-left{display:flex;align-items:center;gap:16px}.card-icon{width:48px;height:48px;border-radius:12px;background-color:#fff3;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:600;color:#fff}.card-name{font-size:18px;font-weight:500;color:#fff}.card-right{text-align:right}.card-price{display:block;font-size:20px;font-weight:600;color:#fff;margin-bottom:4px}.card-time{display:block;font-size:12px;color:#ffffffb3}.card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.2)}.card-tag{display:inline-block;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 2px 4px #0000001a;animation:fadeInTag .3s ease}@keyframes fadeInTag{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.subscriptions-list{min-height:100vh;background-color:var(--bg-primary);padding-bottom:20px}.list-header{padding:calc(var(--tg-content-safe-area-inset-top, 0px) + 50px) 20px 20px 20px;background-color:var(--bg-primary)}.header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.header-left{display:flex;align-items:center;gap:4px}.icon-btn{background:none;border:none;color:var(--text-primary);font-size:24px;cursor:pointer;padding:8px}.add-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;font-size:14px;font-weight:600;cursor:pointer;padding:10px 16px;border-radius:20px;display:flex;align-items:center;gap:6px;box-shadow:0 4px 12px #667eea66;transition:all .3s ease}.add-btn:active{transform:scale(.95);box-shadow:0 2px 8px #667eea4d}.add-icon{font-size:18px;font-weight:700}.add-text{font-size:14px}.header-title{display:flex;align-items:center;gap:8px}.header-title h1{font-size:18px;font-weight:500;color:var(--text-primary)}.total-section{text-align:center}.total-amount,.total-amount-multi{font-size:48px;font-weight:600;color:var(--text-primary);margin-bottom:5px}.total-amount-multi{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px}.currency-total{font-size:36px;white-space:nowrap}.separator{font-size:28px;color:var(--text-secondary);margin:0 4px}.total-label{font-size:14px;color:var(--text-secondary)}.subscriptions-container{padding:0 16px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.empty-state p{font-size:18px;color:var(--text-secondary);margin-bottom:20px}.add-first-btn{background-color:var(--accent-color);color:#fff;border:none;padding:14px 28px;border-radius:12px;font-size:16px;cursor:pointer}.paused-subscriptions-section{margin-top:24px}.paused-subscriptions-toggle{width:100%;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:16px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:16px;color:var(--text-primary);margin-bottom:12px}.paused-subscriptions-toggle:active{opacity:.8}.toggle-text{font-weight:500;color:var(--text-secondary)}.toggle-icon{font-size:12px;color:var(--text-secondary);transition:transform .3s ease;display:inline-block}.toggle-icon.expanded{transform:rotate(180deg)}.paused-subscriptions-list{display:flex;flex-direction:column;gap:12px}.paused-subscription-wrapper{opacity:.5;position:relative}.paused-subscription-wrapper:after{content:"⏸";position:absolute;top:12px;right:12px;font-size:20px;opacity:.6;pointer-events:none}.subscription-form{min-height:100vh;background-color:var(--bg-primary)}.form-header{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--tg-content-safe-area-inset-top, 0px) + 50px) 20px 16px 20px;color:#fff}.back-btn,.save-btn,.custom-btn,.presets-link-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:8px}.presets-link-btn{font-size:16px;text-decoration:underline}.form-header h2{font-size:18px;font-weight:500}.form-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#fff}.preview-icon{width:80px;height:80px;border-radius:20px;background-color:#fff3;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:600;margin-bottom:20px}.preview-price{font-size:32px;font-weight:600}.form-fields{background-color:var(--bg-primary);border-radius:24px 24px 0 0;padding:24px 20px;margin-top:-20px}.form-field{margin-bottom:20px}.form-field label{display:block;font-size:14px;color:var(--text-secondary);margin-bottom:8px}.form-field input,.form-field select{width:100%;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:14px 16px;color:var(--text-primary);font-size:16px}.form-field input::placeholder{color:var(--text-secondary);opacity:.5}.form-field select{cursor:pointer}.save-btn-bottom{width:100%;background-color:var(--accent-color);color:#fff;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;margin-top:20px}.pause-btn{width:100%;background-color:#ff9f0a1a;color:#ff9f0a;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;margin-top:12px}.resume-btn{width:100%;background-color:#34c7591a;color:#34c759;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;margin-top:12px}.delete-btn{width:100%;background-color:#ff3b301a;color:#ff3b30;border:none;border-radius:12px;padding:16px;font-size:16px;font-weight:600;cursor:pointer;margin-top:12px}.presets-grid{padding:20px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.preset-card{border-radius:16px;padding:24px 16px;text-align:center;cursor:pointer;transition:transform .2s}.preset-card:active{transform:scale(.95)}.preset-icon{font-size:32px;font-weight:600;color:#fff;margin-bottom:8px}.preset-name{font-size:16px;font-weight:500;color:#fff;margin-bottom:4px}.preset-price{font-size:14px;color:#fffc}.icon-input-group,.color-input-group{display:flex;gap:8px;align-items:center}.icon-input-group input{flex:1}.emoji-picker-btn{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:14px 16px;font-size:20px;cursor:pointer;min-width:56px}.emoji-picker{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin-top:12px;padding:16px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;max-height:200px;overflow-y:auto}.emoji-option{background:none;border:none;font-size:24px;cursor:pointer;padding:8px;border-radius:8px;transition:background-color .2s}.emoji-option:hover{background-color:var(--bg-accent)}.color-preview{width:56px;height:56px;border-radius:12px;cursor:pointer;border:2px solid var(--border-color);flex-shrink:0}.color-input-group input{flex:1}.color-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:12px;padding:16px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;max-height:250px;overflow-y:auto}.color-option{width:100%;aspect-ratio:1;border:none;border-radius:12px;cursor:pointer;transition:transform .2s;box-shadow:0 2px 8px #0000004d}.color-option:active{transform:scale(.9)}.tags-empty-message{padding:16px;background:var(--bg-secondary);border:1px dashed var(--border-color);border-radius:12px;text-align:center;color:var(--text-secondary);font-size:14px}.tags-selector{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}.tag-option{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:2px solid;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;background:transparent}.tag-option:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.tag-option.selected{box-shadow:0 4px 12px #0003;transform:scale(1.05)}.tag-option:active{transform:scale(.98)}.tag-checkmark{font-size:12px;font-weight:700}.tags-count{margin-top:8px;font-size:12px;color:var(--text-secondary);text-align:right}.tag-manager-section{margin-top:24px}.tag-manager-description{font-size:14px;color:var(--text-secondary);margin-bottom:20px;line-height:1.5}.tag-error{background:#e74c3c1a;border:1px solid rgba(231,76,60,.3);color:#e74c3c;padding:12px 16px;border-radius:12px;margin-bottom:16px;font-size:14px;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tag-create-form{background:var(--card-bg);border:1px solid var(--border-color);border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #0000000d}.tag-input{width:100%;padding:14px 16px;border:2px solid var(--border-color);border-radius:12px;background:var(--input-bg);color:var(--text-primary);font-size:15px;transition:all .3s ease;margin-bottom:16px}.tag-input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #4a90e21a}.tag-input::placeholder{color:var(--text-secondary)}.tag-color-picker{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;padding:12px 0}.color-option{width:40px;height:40px;border-radius:50%;border:3px solid transparent;cursor:pointer;transition:all .3s ease;position:relative;box-shadow:0 2px 8px #00000026}.color-option:hover{transform:scale(1.15);box-shadow:0 4px 12px #00000040}.color-option.selected{border-color:var(--text-primary);transform:scale(1.2);box-shadow:0 4px 12px #0000004d}.color-option.selected:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:18px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.5)}.tag-create-btn{width:100%;padding:14px 24px;background:linear-gradient(135deg,var(--accent-color),#357ABD);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #4a90e24d}.tag-create-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #4a90e266}.tag-create-btn:active:not(:disabled){transform:translateY(0)}.tag-create-btn:disabled{opacity:.5;cursor:not-allowed}.tags-list{display:flex;flex-direction:column;gap:12px}.tags-empty{text-align:center;padding:40px 20px;color:var(--text-secondary)}.tags-empty p:first-child{font-size:16px;margin-bottom:8px}.tags-empty-hint{font-size:14px;opacity:.7}.tag-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;transition:all .3s ease;animation:fadeInScale .3s ease}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.tag-item:hover{transform:translate(4px);box-shadow:0 4px 12px #0000001a;border-color:var(--tag-color)}.tag-badge{display:inline-flex;align-items:center;padding:6px 14px;border-radius:20px;font-size:14px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 2px 6px #00000026;transition:all .3s ease}.tag-delete-btn{width:32px;height:32px;border-radius:50%;border:none;background:#e74c3c1a;color:#e74c3c;font-size:16px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.tag-delete-btn:hover{background:#e74c3c;color:#fff;transform:rotate(90deg) scale(1.1)}.tag-delete-btn:active{transform:rotate(90deg) scale(.95)}.spinner{width:40px;height:40px;margin:40px auto;border:4px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite}[data-theme=dark] .tag-create-form,[data-theme=dark] .tag-item{background:#ffffff08}[data-theme=dark] .tag-input{background:#ffffff0d}[data-theme=light] .tag-create-form,[data-theme=light] .tag-item{background:#fff}[data-theme=light] .tag-input{background:#f8f9fa}@media (max-width: 480px){.tag-color-picker{gap:8px}.color-option{width:36px;height:36px}}.settings{min-height:100vh;background-color:var(--bg-primary)}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--tg-content-safe-area-inset-top, 0px) + 50px) 20px 16px 20px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.settings-header h2{font-size:18px;font-weight:600;color:var(--text-primary)}.settings-header .back-btn{background:none;border:none;color:var(--text-primary);font-size:24px;cursor:pointer;padding:8px}.settings-content{padding:20px}.settings-section{margin-bottom:32px}.settings-section h3{font-size:14px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;margin-bottom:16px;letter-spacing:.5px}.theme-options{display:flex;flex-direction:column;gap:12px}.theme-option{display:flex;align-items:center;padding:16px;background-color:var(--bg-secondary);border:2px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .2s;gap:12px}.theme-option.active{border-color:var(--accent-color);background-color:var(--bg-accent)}.theme-option:active{transform:scale(.98)}.theme-icon{font-size:28px}.theme-label{flex:1;font-size:16px;font-weight:500;color:var(--text-primary);text-align:left}.checkmark{font-size:20px;color:var(--accent-color);font-weight:600}.currency-options,.display-mode-options{display:flex;flex-direction:column;gap:12px}.currency-option,.display-mode-option{display:flex;align-items:center;padding:16px;background-color:var(--bg-secondary);border:2px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .2s;gap:12px;text-align:left}.currency-option.active,.display-mode-option.active{border-color:var(--accent-color);background-color:var(--bg-accent)}.currency-option:active,.display-mode-option:active{transform:scale(.98)}.currency-symbol{font-size:28px}.currency-label{flex:1;font-size:16px;font-weight:500;color:var(--text-primary)}.display-mode-option{flex-direction:column;align-items:flex-start;position:relative}.display-mode-label{font-size:16px;font-weight:500;color:var(--text-primary);margin-bottom:4px}.display-mode-description{font-size:14px;color:var(--text-secondary)}.display-mode-option .checkmark{position:absolute;top:16px;right:16px}.settings-content .spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--text-primary);border-radius:50%;animation:spin 1s linear infinite;margin:40px auto}.statistics{min-height:100vh;background-color:var(--bg-primary);padding-bottom:20px}.statistics-header{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--tg-content-safe-area-inset-top, 0px) + 50px) 20px 20px 20px;background-color:var(--bg-primary);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:10}.statistics-header h2{font-size:20px;font-weight:600;color:var(--text-primary)}.statistics-header .back-btn{background:none;border:none;color:var(--text-primary);font-size:24px;cursor:pointer;padding:8px}.statistics-content{padding:20px;display:flex;flex-direction:column;gap:16px}.stat-card{background-color:var(--bg-secondary);border-radius:16px;padding:24px;box-shadow:0 2px 8px #0000001a}.stat-icon{font-size:48px;text-align:center;margin-bottom:12px}.stat-label{font-size:14px;color:var(--text-secondary);text-align:center;margin-bottom:8px}.stat-value{font-size:36px;font-weight:700;color:var(--text-primary);text-align:center;display:block}.stat-value-multi{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.stat-currency-row{text-align:center}.stat-description{font-size:12px;color:var(--text-tertiary);text-align:center;margin-top:8px}.stat-value-subscription{display:flex;align-items:center;gap:16px;padding:16px;background-color:var(--bg-primary);border-radius:12px;margin-top:12px}.stat-sub-icon{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:32px;flex-shrink:0}.stat-sub-info{flex:1}.stat-sub-name{font-size:18px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.stat-sub-price{font-size:14px;color:var(--text-secondary)}.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat-card-small{background-color:var(--bg-secondary);border-radius:12px;padding:20px;box-shadow:0 2px 8px #0000001a;text-align:center}.stat-icon-small{font-size:32px;margin-bottom:8px}.stat-value-small{font-size:28px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.stat-label-small{font-size:12px;color:var(--text-secondary)}.app{min-height:100vh;background-color:var(--bg-primary);color:var(--text-primary)}.app.loading{display:flex;align-items:center;justify-content:center}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--text-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app.error-container{display:flex;align-items:center;justify-content:center;padding:20px}.error-message{background-color:var(--card-bg);border:2px solid var(--error-color, #ff4444);border-radius:12px;padding:24px;max-width:400px;text-align:center}.error-message h2{margin:0 0 12px;font-size:20px;color:var(--error-color, #ff4444)}.error-message p{margin:0 0 20px;font-size:14px;line-height:1.5;color:var(--text-secondary)}.retry-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:opacity .2s}.retry-button:active{opacity:.7}:root{--bg-primary: #000000;--bg-secondary: #1C1C1E;--bg-accent: rgba(0, 122, 255, .1);--text-primary: #FFFFFF;--text-secondary: rgba(255, 255, 255, .6);--border-color: rgba(255, 255, 255, .1);--accent-color: #007AFF}:root[data-theme=dark]{--bg-primary: #000000;--bg-secondary: #1C1C1E;--bg-accent: rgba(0, 122, 255, .1);--text-primary: #FFFFFF;--text-secondary: rgba(255, 255, 255, .6);--border-color: rgba(255, 255, 255, .1);--accent-color: #007AFF}:root[data-theme=light]{--bg-primary: #F2F2F7;--bg-secondary: #FFFFFF;--bg-accent: rgba(0, 122, 255, .1);--text-primary: #000000;--text-secondary: rgba(0, 0, 0, .6);--border-color: rgba(0, 0, 0, .1);--accent-color: #007AFF}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary);color:var(--text-primary);overflow-x:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}#root{min-height:100vh;background-color:var(--bg-primary)}
