*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0;padding:0}body{background:#f5f7fa;font-family:system-ui,sans-serif}.app{width:100%;max-width:480px;margin:0 auto;padding:12px}.header{color:#fff;background:#00897b;border-radius:12px;margin-bottom:12px;padding:12px 16px}.header h1{margin:0;font-size:1.15rem}.header p{opacity:.9;margin:4px 0 0;font-size:.9rem}.summary{gap:8px;margin-bottom:12px;display:flex}.summary>div{text-align:center;background:#fff;border-radius:10px;flex:1;padding:8px 6px}.summary span{color:#666;font-size:.8rem;display:block}h2{margin:14px 0 6px;font-size:1rem}.list{background:#fff;border-radius:10px;margin:0;padding:0 12px;list-style:none}.list li{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;padding:8px 0;display:flex}.list li:last-child{border-bottom:none}.green{color:#2e7d32}.red{color:#c62828}.muted{color:#888;font-size:.8rem}.error{color:#c62828}.add-form{flex-direction:column;gap:6px;margin-bottom:8px;display:flex}.add-form input,.add-form select,.add-form button{border:1px solid #ccc;border-radius:8px;padding:8px 10px;font-size:.95rem}.add-form button{color:#fff;cursor:pointer;background:#00897b;border:none}.row-right{align-items:center;gap:8px;display:flex}.btn-del{color:#c62828;cursor:pointer;background:#ffebee;border:none;border-radius:6px;padding:4px 8px;font-size:.8rem}.month-nav{justify-content:space-between;align-items:center;margin-top:8px;display:flex}.month-nav p{margin:0}.month-nav button{color:#fff;cursor:pointer;background:#fff3;border:none;border-radius:8px;width:32px;height:32px}.btn-edit{color:#00695c;cursor:pointer;background:#e0f2f1;border:none;border-radius:6px;padding:4px 8px;font-size:.8rem}.btn-cancel{color:#333!important;background:#eee!important}